flutter - 动画小部件仅动画一次

Question

我有一个带有动画 AnimatedText 的小部件，在第一个动画之后，它似乎没有使用 setState 重建。

Widget build(BuildContext context) {
   return createPage(texts[currentIndex]);
}

  Widget createPage(Excerpt excerpt) {
    return new Material(child: new Stack(
        children: <Widget>[
          createBackgroundImage(excerpt),
          new Column(mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                new Flexible(flex: 6, child: new SizedBox.expand()),
                new Flexible(flex: 1,
                    child: createHeader(excerpt)),
                new Flexible(flex: 4,
                    child: createTextBox(excerpt))
              ]),
        ]
    ));
  }
   Widget createTextBox(Excerpt excerpt) {
       return new SizedBox.expand(child: new FlatButton(
            color: Colors.black,
            child: new Container(
                padding: new EdgeInsets.only(top: 10.0),
                constraints: new BoxConstraints.expand(),
                child: new AnimatedText(excerpt.text)),
            onPressed: () {
              setState(() {//update index});
            }

AnimatedTest 类:

class AnimatedText extends StatefulWidget {
  String text;

  AnimatedText(this.text);

  @override
  AnimatedTextState createState() => new AnimatedTextState(text);
}

class AnimatedTextState extends State<AnimatedText>
    with SingleTickerProviderStateMixin {
  String text;
  String currentText = "";
  AnimationController controller;
  Animation animation;
  AnimatedTextState(this.text){
    print(text);
  }

  @override
  void initState() {
    super.initState();
    controller = new AnimationController(
        upperBound: text.length.toDouble(),
        duration: new Duration(seconds: 3),
        vsync: this);
    controller.addListener((){
      setState((){
        currentText = text.substring(0,controller.value.round());
      });
    });
    controller.forward();
  }

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

  @override
  Widget build(BuildContext context) =>
      new Text(currentText, style: speakerStyle());
}

标题小部件每次都会重建，但带有动画文本的部分不会。 关于如何解决此问题的任何想法都会有所帮助

Answer 1

Widget 上的字段应该是最终的。 State 构造函数不应该接受参数。 您应该实现 didUpdateConfig 以从新的 Widget 中获取数据以更新您的 State 的文本字段。