Flutter 问题：如何在 Flutter 中使用 Marquee 文本？

Question

我想使用 Marquee 我的文本小部件在哪里。

当我通过删除文本小部件来使用选取框时使用选取框后，我的文本正在消失并在控制台中出现更多错误。

所以请帮我使用选框。

import 'package:flutter/material.dart';
import 'package:hospital/CartIcon/cart_icon.dart';
import 'package:hospital/Drawer/dropdown_menu.dart';
import 'package:hospital/MyOrderPage/MyOrderDetailsViewPage/myOrderDetailsView.dart';
import 'package:hospital/constant.dart';


import 'package:intl/intl.dart';
import 'package:marquee/marquee.dart';

class MyOrderPage extends StatefulWidget {
  const MyOrderPage({Key key}) : super(key: key);

  @override
  _MyOrderPageState createState() => _MyOrderPageState();
}

class _MyOrderPageState extends State<MyOrderPage> {
  // final DateTime orderDate = DateTime.now();

  final DateTime orderDate = DateTime.now();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: kGreen,
        title: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              "My Order",

              style: TextStyle(fontStyle: FontStyle.italic),
            ),
          ],
        ),
        actions: [CartIcon(), DropDownMenu()],
      ),
      body: Column(
        children: [
          Container(
              // height: 200,
              padding: EdgeInsets.all(8),
              child: Container(
                decoration: BoxDecoration(
                  boxShadow: [
                    BoxShadow(

                      color: Theme.of(context).primaryColor.withOpacity(0.3),
                      blurRadius: 8,
                    )
                  ],
                  borderRadius: BorderRadius.circular(8),
                  color: Colors.white,
                ),
                child: Padding(
                  padding: EdgeInsets.all(15),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Row(

                        children: <Widget>[
                          Flexible(
//I want to use marquee user instead of text widget here
//Marquee(
  //    text: 'GeeksforGeeks is a one-stop destination for programmers.',
    //  style: TextStyle(fontWeight: FontWeight.bold),
      //scrollAxis: Axis.horizontal,
 //     crossAxisAlignment: CrossAxisAlignment.start,
   //   blankSpace: 20.0,
     // velocity: 100.0,
    //  pauseAfterRound: Duration(seconds: 1),
      //showFadingOnlyWhenScrolling: true,
     // fadingEdgeStartFraction: 0.1,
     // fadingEdgeEndFraction: 0.1,
     // numberOfRounds: 3,
      //startPadding: 10.0,
   //   accelerationDuration: Duration(seconds: 1),
     // accelerationCurve: Curves.linear,
  //    decelerationDuration: Duration(milliseconds: 500),
    //  decelerationCurve: Curves.easeOut,
    //)

                            child: Text(


                              'Spondylolysis,Pittasnadhanak,D_stone,Natural Tulsi',
                              overflow: TextOverflow.ellipsis,
                              style: TextStyle(
                                color: Colors.black,

                                fontSize: 20,
                              ),
                            ),
                          ),
                         
                        ],
                      ),
                                          SizedBox(
                        height: 10,
                      ),
                      Column(

                        crossAxisAlignment: CrossAxisAlignment.start,
                        // mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Row(
                            children: <Widget>[
                              Text('20-07-2021',
                                  style: TextStyle(
                                      color: Colors.black54,
                                      // fontWeight: FontWeight.bold,
                                      fontSize: 20)),
                             
                            ],
                          ),
                          SizedBox(
                            height: 6,
                          ),

                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: <Widget>[
                              Text('Delivery Status',
                                  style: TextStyle(
                                      color: Colors.black54,
                                      // fontWeight: FontWeight.bold,
                                      fontSize: 20)),
                              
                              Text('Delivered',
                                  style: Theme.of(context)
                                      .textTheme
                                      .headline6
                                      .copyWith(color: Colors.green)),
                            ],
                          )

                        ],
                      ),
                      SizedBox(
                        height: 4,
                      ),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Row(
                            children: <Widget>[
                              Text('Quantity: ',

                                  style: TextStyle(
                                      color: Colors.black54,
                                      // fontWeight: FontWeight.bold,
                                      fontSize: 20)),
                              Padding(
                                padding: const EdgeInsets.only(left: 4),
                                child: Text('3',
                                    style: TextStyle(
                                        color: Colors.black,
                                        // fontWeight: FontWeight.bold,
                                        fontSize: 18)),
                              ),
                            ],
                          ),
                          Row(
                            children: <Widget>[
                              Text('Totat Amount: ',

                                  style: TextStyle(
                                      color: Colors.black54,
                                      // fontWeight: FontWeight.bold,
                                      fontSize: 20)),
                              Padding(
                                padding: const EdgeInsets.only(left: 15),
                                child: Text('324' + '\$',
                                    //total amount
                                    style: TextStyle(
                                        color: Colors.black,
                                        fontWeight: FontWeight.bold,
                                        fontSize: 20)),
                              ),
                            ],

                          )
                        ],
                      )
                    ],

                  ),
                ),
              )),
          SizedBox(
            height: 5,
          ),

        ],
      ),
    );
  }
}

我想使用 Marquee 我的文本小部件在哪里。 当我通过删除文本小部件来使用选取框时使用选取框后，我的文本正在消失并在控制台中出现更多错误。

Answer 1

class MarqueeWidget extends StatefulWidget {
  final Widget child;
  final Axis direction;
  final Duration animationDuration, backDuration, pauseDuration;

  MarqueeWidget({
    @required this.child,
    this.direction: Axis.horizontal,
    this.animationDuration: const Duration(milliseconds: 3000),
    this.backDuration: const Duration(milliseconds: 800),
    this.pauseDuration: const Duration(milliseconds: 800),
  });

  @override
  _MarqueeWidgetState createState() => _MarqueeWidgetState();
}

class _MarqueeWidgetState extends State<MarqueeWidget> {
  ScrollController scrollController;

  @override
  void initState() {
    scrollController = ScrollController(initialScrollOffset: 50.0);
    WidgetsBinding.instance.addPostFrameCallback(scroll);
    super.initState();
  }

  @override
  void dispose(){
    scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: widget.child,
      scrollDirection: widget.direction,
      controller: scrollController,
    );
  }

  void scroll(_) async {
    while (scrollController.hasClients) {
      await Future.delayed(widget.pauseDuration);
      if(scrollController.hasClients)
        await scrollController.animateTo(
            scrollController.position.maxScrollExtent,
            duration: widget.animationDuration,
            curve: Curves.ease);
      await Future.delayed(widget.pauseDuration);
      if(scrollController.hasClients)
        await scrollController.animateTo(0.0,
            duration: widget.backDuration, curve: Curves.easeOut);
    }
  }
}


class MarqueeText extends StatefulWidget {
  @override
  _MarqueeTextState createState() => _MarqueeTextState();
}

class _MarqueeTextState extends State<MarqueeText> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Marquee Text"),
        ),
        body: Center(
          child: SizedBox(
              width: 200.0,
              child: MarqueeWidget(
                  direction: Axis.horizontal,
                  child: Text(
                      "your text"))),
        ));
  }
}