Flutter-如何在文本()中显示一个计时器60秒



我正在构建一个应用程序,该应用需要在文本((中显示一个计时器,持续时间为60秒,当屏幕打开时,计时器从0到60秒开始自动启动text((。

我尝试使用时构建器lib,但是我没有iDeia如何获得时间(分钟和秒(运行以放入文本((。

class ClockWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return TimerBuilder.periodic(Duration(seconds: 60),
      builder: (context) {
        return Text("00:00");
      }
    );
  }
}

单击按钮时从0到60。

Timer _timer;
int _start = 0;
void startTimer() {
  const oneSec = const Duration(seconds: 1);
  _timer = new Timer.periodic(
      oneSec,
      (Timer timer) => setState(() {
            if (_start > 60) {
              timer.cancel();
            } else {
              _start = _start + 1;
            }
          }));
}
@override
void dispose() {
  _timer.cancel();
  super.dispose();
}
Widget build(BuildContext context) {
  return new Scaffold(
      appBar: AppBar(title: Text("Timer test")),
      body: Column(
        children: <Widget>[
          RaisedButton(
            onPressed: () {
              startTimer();
            },
            child: Text("start"),
          ),
          Text("$_start")
        ],
      ));
}

我必须使用AnimatedBuilder来解决我的问题。

  String get timerString {
    Duration duration = controller.duration * controller.value;
    return '${(duration.inSeconds  % 60).toString().padLeft(2, '0')}';
  }
AnimatedBuilder(
              animation: controller,
              builder: (context, child){
                return Text(
                  timerString,
                  style: TextStyle(
                    fontSize: 20,
                    fontWeight: FontWeight.bold,
                  ) ,
                );
              }
          ),

相关内容

最新更新