Flutter 倒计时 Flutter学习实践指南

Flutter 倒计时 ??写一个倒计时定时器听起来真的好简单，然而在 Flutter 里面写这个东西还是挺坑的。原本以为创建一个 Timer 就一切都搞定了，但并没办法实时获取倒计时的进度。

void countdown(){ Timer timer = new Timer(new Duration(seconds: 10), () { // 只在倒计时结束时回调 }); }

??看了一下源码，我们还可以创建一个周期性的 Timer，从打印结果可以看到 Timer 的 tick 是从1开始的。

void countdown(){ Timer countdownTimer =new Timer.periodic(new Duration(seconds: 1), (timer) { print(countdownTimer.tick); } }

【Flutter 倒计时】??我们修改一下做一个倒计时获取重新获取验证码的功能。

Timer _countdownTimer; String _codeCountdownStr = '获取验证码'; int _countdownNum = 59; void reGetCountdown() { setState(() { if (_countdownTimer != null) { return; } // Timer的第一秒倒计时是有一点延迟的，为了立刻显示效果可以添加下一行。 _codeCountdownStr = '${_countdownNum--}重新获取'; _countdownTimer = new Timer.periodic(new Duration(seconds: 1), (timer) { setState(() { if (_countdownNum > 0) { _codeCountdownStr = '${_countdownNum--}重新获取'; } else { _codeCountdownStr = '获取验证码'; _countdownNum = 59; _countdownTimer.cancel(); _countdownTimer = null; } }); }); }); } // 不要忘记在这里释放掉Timer @override void dispose() { _countdownTimer?.cancel(); _countdownTimer = null; super.dispose(); }