Question

我在Flutter中创建了一个屏幕，其中显示了倒数计时器。我可以播放，暂停和重新启动计时器，但是我试图找出如何在计时器达到0时执行操作（例如，重新启动自身）。

由于dart文件相当长，我只在我认为是此处相关部分的下方进行复制。但是我可以根据需要添加更多内容。

首先，我为倒数计时器创建一个小部件/类：

class Countdown extends AnimatedWidget {
  Countdown({ Key key, this.animation }) : super(key: key, listenable: animation);
  Animation<int> animation;

  @override

  build(BuildContext context){
    return Text(
      animation.value.toString(),
      style: TextStyle(         
        fontSize: 120,
        color: Colors.deepOrange
      ),
    );
  }
}

然后，我有一个有状态的小部件，该小部件创建控制器并还导入一些数据（gameData.countdownClock是倒数计时器的开始时间，它来自于先前屏幕上的用户输入）：


class _GameScreenState extends State<GameScreen> with TickerProviderStateMixin {

AnimationController _controller;

  _GameScreenState(this.gameData);
  GameData gameData;

  @override


  void initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: Duration(seconds: gameData.countdownClock),
    );
  }

然后显示时钟的容器：

Container(
                                          child: Countdown(
                                            animation: StepTween(
                                              begin: gameData.countdownClock,
                                              end: 0,
                                            ).animate(_controller),
                                          ),
                                        ),

我是否必须在最后一个容器中添加侦听器？或者别的地方？（或者完全是其他东西！）

感谢您的帮助。谢谢

Answer 1

动画控制器的可能值在0到1之间。因此，我认为您必须在gamedata.countDownClock上添加侦听器请检查以下代码，您可能会从中得到一些启发。

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

class GameScreen extends StatefulWidget {
  @override
  _GameScreenState createState() => _GameScreenState();
}

class _GameScreenState extends State<GameScreen> with SingleTickerProviderStateMixin {

  int countdownClock = 10;

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

    // Your Game Data Counter Change every one Second
    const oneSec = const Duration(seconds:1);
    new Timer.periodic(oneSec, (Timer t) {
      // Restart The Counter Logic
      if (countdownClock == 0)
        countdownClock = 11;
      setState(() { countdownClock = countdownClock - 1; });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("")),
      body: Center(
        child: Text('$countdownClock')
      ),
    );
  }
}

Answer 2

我在此页面上找到了答案：

After complete the widget animation run a function in Flutter

我需要在.addStatusListener的动画控制器中添加initState()。

新的initState()代码如下所示：

void initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: Duration(seconds: gameData.countdownClock),
    );

    _controller.addStatusListener((status){
      if(status == AnimationStatus.completed){
        _controller.reset();
      }
    }
    );
  }

颤振：倒数计时器到0时执行操作

2 个答案: