flutter 写一个计时组件,app进入后台也不停止
时间: 2024-02-03 08:03:35 浏览: 126
好的,我可以为你解答。可以使用 Flutter 中的 Timer 类来实现计时器功能,并借助 WidgetsBindingObserver 来监听 App 生命周期,从而实现当 App 进入后台时计时器依然继续运行的效果。以下是示例代码:
```dart
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class TimerWidget extends StatefulWidget {
@override
_TimerWidgetState createState() => _TimerWidgetState();
}
class _TimerWidgetState extends State<TimerWidget> with WidgetsBindingObserver {
Timer _timer;
int _count = 0;
@override
void initState() {
super.initState();
_timer = Timer.periodic(Duration(seconds: 1), (timer) {
setState(() {
_count++;
});
});
WidgetsBinding.instance.addObserver(this);
}
@override
void dispose() {
_timer.cancel();
WidgetsBinding.instance.removeObserver(this);
super.dispose();
}
@override
void didChangeAppLifecycleState(AppLifecycleState state) {
if (state == AppLifecycleState.resumed && _timer.isActive == false) {
_timer = Timer.periodic(Duration(seconds: 1), (timer) {
setState(() {
_count++;
});
});
} else if (state == AppLifecycleState.paused && _timer.isActive == true) {
_timer.cancel();
}
}
@override
Widget build(BuildContext context) {
return Text(
'$_count',
style: TextStyle(fontSize: 24),
);
}
}
```
在 initState 中创建一个 Timer 实例,并在每秒回调中更新计数器的值。同时通过 WidgetsBindingObserver 监听 App 生命周期,当 App 进入后台时,如果 Timer 正在运行则取消,当 App 重新进入前台时,如果 Timer 没有运行则重新创建。最后在 build 方法中显示计数器的值即可。
阅读全文