Flutter：在父状态更改时重新渲染子小部件

Question

因此，a 有一个有状态的父级，其值为 timer。该定时器可由用户重新设置。我还有一个带有动画控制器的子状态小部件。父级将timer 值传递给该子级以重置动画。这是一些代码：

class _ParentState extends State<Parent> {
  int timer = 20;
  
  void _userInput() {
    setState(() {
      timer = 20;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Child(
      time: timer
    );
  }
}

注意：为简单起见，此处已删除

因此，当我的用户触发_userInput 方法时，计时器值会发生变化，但孩子不会。这是我的完整子小部件：

class TimerProgress extends StatefulWidget {
  TimerProgress({
    Key key,
    @required this.time,
    @required this.onCompleted
  }) : super(key: key);

  final int time;
  final Function onCompleted;

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

class _TimerProgressState extends State<TimerProgress> with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<double> _widthAnimation;

  @override
  void initState() {
    _controller = AnimationController(
      duration: Duration(seconds: widget.time),
      vsync: this
    );

    _widthAnimation = Tween<double>(
      begin: 200,
      end: 0
    ).animate(CurvedAnimation(
      parent: _controller,
      curve: Curves.linear
    ));

    _controller.addListener(() {
      if (_controller.value == 1) {
        widget.onCompleted();
      }
    });

    _controller.forward();

    super.initState();
  }

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

  @override
  Widget build(BuildContext context) {
    return ...
  }
}

所以这一切都有效，但理想情况下我希望重置动画，这不起作用......

Answer 1

initState 每个状态实例只运行一次。

在didUpdateWidget:https://api.flutter.dev/flutter/widgets/RawScrollbarState/didUpdateWidget.html内部实现时间重置

你不能（因为它会导致递归循环，setState 将再次触发didUpdateWidget）并且不应该（在调用此方法后，正在调用build）必须在内部调用setState这个方法。

可运行示例：https://www.dartpad.dev/848976603f866f4e3aa6030aba8addf7?null_safety=true