Flutter setState 正在重新启动动画

Question

我的这个计时器工作正常：

Widget timer(int index) {
    return Center(
      child: AnimatedBuilder(
        animation: timerAnimationList[index],
        builder: (context, child) {
          final double seconds = timerAnimationList[index].value / 1000;
          final int integer = seconds.truncate();
          final int decimals = (seconds % 1 * 1000).truncate();
          String decimalsString = decimals.toString();

          switch (decimalsString.length) {
            case 1:
              decimalsString = '00$decimals';
            case 2:
              decimalsString = '0$decimals';
          }

          return Text(
            '${integer.toString()}:$decimalsString',
            style: const TextStyle(fontSize: 50),
          );
        },
      ),
    );

它从 0 到 10，显示类似

2:453

的内容。当这个计时器完成或停止时，我会显示一个重新开始的按钮。在这个按钮内，出于测试目的，我只有这个：

setState(() {
    });

添加此操作时，计时器会继续运行，就像我跑步一样

timerControllerList[index].forward()

为什么会发生这种情况？我还尝试向显示计时器的

Text()

添加一个唯一的键，但它什么也没做。

更多信息：动画控制器位于列表中，因为我有不同的计时器要玩。

class _GamePageState extends State<GamePage> with TickerProviderStateMixin {
  List<dynamic> timerControllerList = [];
  List<Animation> timerAnimationList = [];

     @override
  void initState() {
    super.initState();
    initTimer();
} 

    void initTimer() {
        late AnimationController timerController;
        late Animation<int> timerAnimation;
        int timerCounter = 10;
    
timerController = AnimationController(
      vsync: this,
      duration: Duration(seconds: timerCounter),
    );

    timerAnimation =
        StepTween(begin: 0, end: timerCounter * 1000).animate(timerController)
          ..addStatusListener((status) {
            if (status == AnimationStatus.completed) {
              print('TIMER FINISHED');
            }
          });

    timerControllerList.add(timerController);
    timerAnimationList.add(timerAnimation);
  }

小部件位置：

Stack(
        children: [
          timer(),
          button(),
        ],

额外信息：

尝试在此处重现此内容时：https://zapp.run/edit/flutter-zp7q06llp7r0?entry=lib/main.dart&file=lib/main.dart 我发现有一个普通的按钮，没有任何动画，只有一个带有 setState 的 onPress，它不会产生同样的问题。对于我的情况，我有一些不同的东西，我可能会与其他动画发生冲突：

SlideInUp(
        manualTrigger: true,
        delay: const Duration(seconds: 2),
        controller: (controller) => playAgainButtonController = controller,
        child: ElevatedButton...

当计时器停止（）时，我转发（）此按钮以显示。视频：https://www.youtube.com/shorts/TlPtGNkyQ5U

这是使用这个包：https://pub.dev/packages/animate_do （顺便说一句，我上周安装了 if，受欢迎程度是 98％，今天却是 76％。为什么？）

Answer 1

我刚刚发现了我的问题。与任何包无关，只是我拥有小部件的方式。

所以我有这样的事情：

Widget displayWidgets(int index) {
    if (countingDown) return countDown(); // initial countdown before the timer

    countingUp = true;
    timerControllerList[index].forward();
    blackBGControllerList[index].forward();

    return timer(index); // actual timer that I mentioned
  }

因此，当我单击按钮来更新状态时，以及像

countingUp

这样的一些变量，我也会触发下一个forward()。 因此，解决方案是将这 3 行移至启动计时器之前的初始倒计时（或者例如，它可能是 initState）：

 void initCountDown() {
    countDownController = AnimationController(
      vsync: this,
      duration: Duration(seconds: countDownCounter),
    );

    countDownAnimation =
        IntTween(begin: countDownCounter, end: 0).animate(countDownController)
          ..addStatusListener((status) {
            if (status == AnimationStatus.completed) {
              setState(() {
                countingDown = false;
                countingUp = true;
                for (var i = 0; i < players; i++) {
                  timerControllerList[i].forward();
                  blackBGControllerList[i].forward();
                }
                countDownController.reset();
              });
            }
          });

    countDownController.forward();
  }