級別：★☆☆☆☆
標(biāo)簽：「Flutter Timer」
作者： ITWYW
審校： QiShare團(tuán)隊
前言
筆者最近寫 Flutter 時，使用 Timer 過程中遇到了一些問題，在本文中做一個分享。
一、創(chuàng)建 Timer
使用如下代碼可以創(chuàng)建一個時間間隔為1秒，執(zhí)行10次操作的Flutter Timer。
int countValue = 10;
Timer _timer;
// 啟動Timer
void _startTimer() {
final Duration duration = Duration(seconds: 1);
cancelTimer();
_timer = Timer.periodic(duration, (timer) {
countValue = countValue -1;
if (this.mounted) {
setState(() {
});
}
print('CountValue');
print(countValue);
if (countValue <= 0) {
cancelTimer();
}
});
}
二、Timer 常見問題
Flutter Timer 使用過程中可能在頁面銷毀或應(yīng)用進(jìn)入后臺時，忘記取消 Timer。下邊筆者給大家分享下相應(yīng)場景的取消 Timer 的方式。
1. 返回到上一個頁面時沒有銷毀 Timer
處理方式如下：
1.1 實現(xiàn)取消 Timer 的邏輯
void cancelTimer() {
if (_timer != null) {
_timer.cancel();
}
}
1.2 在頁面銷毀的時候，調(diào)用取消 Timer 的邏輯
@override
void dispose() {
cancelTimer();
super.dispose();
}
2. 取消Timer相關(guān)的生命周期
當(dāng)應(yīng)用進(jìn)入后臺的時候，我們也希望把 Timer 取消掉，處理方式如下：實現(xiàn)抽象類 WidgetsBindingObserver 的接口，并且實現(xiàn)相應(yīng)抽象方法做取消 Timer 的處理邏輯。
2.1 當(dāng)前 State 類遵守 WidgetsBindingObserver 協(xié)議
class _TimerState extends State<TimerPage> with WidgetsBindingObserver {
}
2.2 State 類實現(xiàn)如下檢測應(yīng)用生命周期變動的方法
在如下聲明周期變動的方法中，做取消 timer 的操作。在應(yīng)用進(jìn)入后臺后，先進(jìn)入到 inactive，然后進(jìn)入paused 的狀態(tài)。 此時可以取消 timer ，避免應(yīng)用在進(jìn)入后臺后，還在執(zhí)行 Timer 中的處理。
@override
void didChangeAppLifecycleState(AppLifecycleState state) {
print('state狀態(tài)：$state');
switch (state) {
case AppLifecycleState.resumed: {
break;
}
case AppLifecycleState.paused:{
cancelTimer();
break;
}
case AppLifecycleState.inactive:{
cancelTimer();
break;
}
case AppLifecycleState.detached:{
cancelTimer();
break;
}
}
super.didChangeAppLifecycleState(state);
}
三、參考學(xué)習(xí)網(wǎng)址
四、推薦文章
Flutter中的RenderObjectElement與RenderObjectWidget
Flutter中的StatelessWidget及其生命周期
Flutter中的Widget
Flutter中的Element（下篇）
Flutter中的Element（上篇）
iOS 解決 [NSURL fileURLWithPath:] 對 # 的編碼問題
Xcode 調(diào)整導(dǎo)航目錄字體大小b
Swift 5.1 (21) - 泛型
Swift 5.1 (20) - 協(xié)議
Swift 5.1 (19) - 擴展
Swift 5.1 (18) - 嵌套類型
淺談編譯過程
