Flutter 不更新 subwidget

Question

我有一个小部件，其中包含一个子小部件。它在 build 方法中获取最后一个新值，如下所示：

children: <Widget>[
                    AspectRatio(
                      aspectRatio: 1.0,
                      child: Container(
                        padding: const EdgeInsets.all(16.0),
                        child: CircleWidget(_lastWindSpeed/10, _speed/10),
                      ))
                  ],
                ),

状态将更新为

setState

但是如果有新值，小部件不会更新。

有没有人看到那里的问题？

班级是：

import 'package:flutter/material.dart';
import 'circle_painter.dart';

class CircleWidget extends StatefulWidget {
  final double _start;
  final double _finish;
  CircleWidget(this._start, this._finish);

  @override
  State<CircleWidget> createState() => new _CircleState();
}

class _CircleState extends State<CircleWidget> with SingleTickerProviderStateMixin{

  Animation<double> animation;
  double _fraction;

  @override
  void initState() {
    super.initState();
    var controller = AnimationController(duration: new Duration(milliseconds: 10), vsync: this);
    animation = Tween(begin: widget._start, end: widget._finish).animate(controller)
      ..addListener((){
        setState(() {
          _fraction = animation.value;
        });
      });
    controller.forward();
  }
  @override
  Widget build(BuildContext context) {
    return new CustomPaint(
        painter: new CirclePainter(_fraction));
  }
}

非常感谢。

Answer 1

如果您希望动画在值CircleWidget更改时重新启动，则需要使用didUpdateWidget生命周期。 initState仅调用一次，而didUpdateWidget每次重新创建相应的小部件时都会调用一次 - 请注意，如果父小部件也重建，则值可能相同。

@override
void didUpdateWidget(CircleWidget oldWidget) {
  if (oldWidget._start != widget._start || 
    oldWidget._end != widget._end) {
    // values changed, restart animation.
    controller
      ..reset()
      ..forward();
  }
  super.didUpdateWidget(oldWidget);
}

Answer 2

我想发布上述给定解决方案的替代解决方案。如果您想StatefulWidget在调用时setState或在 a 内部更新其底层数据，StreamBuilder则应将 a 传递UniqueKey给StatefulWidget构造函数。fullter whensetState被调用时的行为是检查类型是否没有改变，StatefulWidget如果没有，则不会更新任何内容。如果UniqueKey向构造函数添加 a ，flutter UI 更新程序将改为检查密钥。我希望这有帮助。

import 'package:flutter/material.dart';
import 'circle_painter.dart';

class CircleWidget extends StatefulWidget {
  final double _start;
  final double _finish;
  CircleWidget(this._start, this._finish, Key:key):super(key:key); // <-- check this

  @override
  State<CircleWidget> createState() => new _CircleState();
}

class _CircleState extends State<CircleWidget> with SingleTickerProviderStateMixin{

  Animation<double> animation;
  double _fraction;

  @override
  void initState() {
    super.initState();
    var controller = AnimationController(duration: new Duration(milliseconds: 10), vsync: this);
    animation = Tween(begin: widget._start, end: widget._finish).animate(controller)
      ..addListener((){
        setState(() {
          _fraction = animation.value;
        });
      });
    controller.forward();
  }
  @override
  Widget build(BuildContext context) {
    return new CustomPaint(
        painter: new CirclePainter(_fraction));
  }
}



children: <Widget>[
                    AspectRatio(
                      aspectRatio: 1.0,
                      child: Container(
                        padding: const EdgeInsets.all(16.0),
                        child: CircleWidget(_lastWindSpeed/10, _speed/10, key: UniqueKey()), // <---- add UniqueKey as key param here to tell futter to check keys instead of types
                      ))
                  ],
                ),