先说State的生命周期，有状态的控件，它的state是有生命周期的：
class Child extends StatefulWidget {
final int count;
// Child({Key key, this.count}) : super(key: key);
const Child({super.key, required this.count});
@override
_ChildState createState() => _ChildState();
}
class _ChildState extends State<Child> {
//绘制界面
@override
Widget build(BuildContext context) {
print("child build......");
return Text('点击按钮查看状态变化 count: ${widget.count}');
}
//当Widget第一次插入到Widget树时会被调用。对于每一个State对象，Flutter只会调用该回调一次
@override
void initState() {
super.initState();
print("page2 child initState......");
}
/*
*初始化时，在initState之后立刻调用
*当State的依赖关系发生变化时，会触发此接口被调用
*/
@override
void didChangeDependencies() {
super.didChangeDependencies();
print("page2 child didChangeDependencies......");
}
//状态改变的时候会调用该方法,比如父类调用了setState
@override
void didUpdateWidget(Child oldWidget) {
super.didUpdateWidget(oldWidget);
print("page2 child didUpdateWidget......");
}
//当State对象从树中被移除时，会调用此回调
@override
void deactivate() {
super.deactivate();
print('page2 child deactivate......');
}
//当State对象从树中被永久移除时调用；通常在此回调中释放资源
@override
void dispose() {
super.dispose();
print('page2 child dispose......');
}
}
Child控件，是有状态的，它的count值，每次点击之后，setState之后，都会更新。使用Child控件，更新count值之后，调用setState方法，就会更新Child的UI。 初始化的一系列生命周期方法回调：
I/flutter (23419): page2 child initState......
I/flutter (23419): page2 child didChangeDependencies......
I/flutter (23419): child build......
完整的：
I/flutter (23419): page2 parent initState......
I/flutter (23419): page2 parent didChangeDependencies......
I/flutter (23419): page2 parent build......
I/flutter (23419): page2 child initState......
I/flutter (23419): page2 child didChangeDependencies......
I/flutter (23419): child build......
点击setState，更新count值，UI发生变化之后的生命周期方法回调：
I/flutter (23419): page2 parent setState......
I/flutter (23419): page2 parent build......
I/flutter (23419): page2 child didUpdateWidget......
I/flutter (23419): child build......
当当前控件不再展示时，也就是Widget移除Widget树时，生命周期方法回调：
I/flutter (23419): page2 parent deactivate......
I/flutter (23419): page2 child deactivate......
I/flutter (23419): page2 child dispose......
I/flutter (23419): page2 parent dispose......
使用Child控件：Parent控件使用Child控件
class Parent extends StatefulWidget {
//Parent({Key key}) : super(key: key);
Parent({super.key});
_ParentState createState() => _ParentState();
}
class _ParentState extends State<Parent> {
int _counter = 0;
//当Widget第一次插入到Widget树时会被调用。对于每一个State对象，Flutter只会调用该回调一次
@override
void initState() {
super.initState();
print("page2 parent initState......");
}
@override
void setState(fn) {
super.setState(fn);
print("page2 parent setState......");
}
/*
*初始化时，在initState之后立刻调用
*当State的依赖关系发生变化时，会触发此接口被调用
*/
@override
void didChangeDependencies() {
super.didChangeDependencies();
print("page2 parent didChangeDependencies......");
}
//绘制界面
@override
Widget build(BuildContext context) {
print("page2 parent build......");
return Scaffold(
appBar: AppBar(title: Text("setState demo")),
body: Center(
child: ElevatedButton(
///点击事件
onPressed: () {
setState(() {
_counter++;
});
},
child: Child(count:_counter),
)),
);
}
//状态改变的时候会调用该方法,比如父类调用了setState
@override
void didUpdateWidget(Parent oldWidget) {
super.didUpdateWidget(oldWidget);
print("page2 parent didUpdateWidget......");
}
//当State对象从树中被移除时，会调用此回调
@override
void deactivate() {
super.deactivate();
print('page2 parent deactivate......');
}
//当State对象从树中被永久移除时调用；通常在此回调中释放资源
@override
void dispose() {
super.dispose();
print('page2 parent dispose......');
}
}
用一张图表示：
1、第一次展示到屏幕上时会依次调用当前element的构造函数,initState,didChangeDependencies,build 2、如果只是自己发生了更新，则只会回调build。如果当前对象的父节点发生更新，则会调用didUpdateWidget和build。如果依赖的InheritedWidget发生了改变，则还会先回调didChangeDependencies。 3、当widget被移除的的时候，会依次调用deactive和dispose
App的生命周期
控件的生命周期，定义了控件的加载到构建的全过程，其回调机制能够确保我们可以根据控件的状态选择合适的时机做恰当的事情。而 App 的生命周期，则定义了 App 从启动到退出的全过程。
在原生 Android、iOS 开发中，有时我们需要在对应的 App 生命周期事件中做相应处理，比如 App 从后台进入前台、从前台退到后台，或是在 UI 绘制完成后做一些处理。
这样的需求，在原生开发中，我们可以通过重写 Activity、ViewController 生命周期回调方法，或是注册应用程序的相关通知，来监听 App 的生命周期并做相应的处理。而在 Flutter 中，我们可以利用 WidgetsBindingObserver 类，来实现同样的需求。
我们来看看 WidgetsBindingObserver 中具体有哪些回调函数：
abstract class WidgetsBindingObserver {
//页面pop
Future<bool> didPopRoute() => Future<bool>.value(false);
//页面push
Future<bool> didPushRoute(String route) => Future<bool>.value(false);
//系统窗口相关改变回调，如旋转
void didChangeMetrics() { }
//文本缩放系数变化
void didChangeTextScaleFactor() { }
//系统亮度变化
void didChangePlatformBrightness() { }
//本地化语言变化
void didChangeLocales(List<Locale> locale) { }
//App生命周期变化
void didChangeAppLifecycleState(AppLifecycleState state) { }
//内存警告回调
void didHaveMemoryPressure() { }
//Accessibility相关特性回调
void didChangeAccessibilityFeatures() {}
}
App 生命周期的回调 didChangeAppLifecycleState，和帧绘制回调 addPostFrameCallback 与 addPersistentFrameCallback。
didChangeAppLifecycleState 回调函数中，有一个参数类型为 AppLifecycleState 的枚举类，这个枚举类是 Flutter 对 App 生命周期状态的封装。它的常用状态包括 resumed、inactive、paused 这三个。
resumed：可见的，并能响应用户的输入。 inactive：处在不活动状态，无法处理用户响应。 paused：不可见并不能响应用户的输入，但是在后台继续活动中。
混用WidgetsBindingObserver，注册监听器，重写你要监听的生命周期，比如：
//监听App生命周期回调
@override
void didChangeAppLifecycleState(AppLifecycleState state) async {
print("$state");
if (state == AppLifecycleState.resumed) {
//do sth
}
}
将App，退入后台，它的状态变化是：
I/flutter (23419): AppLifecycleState.inactive
I/flutter (23419): 实时Frame绘制回调
I/flutter (23419): AppLifecycleState.hidden
I/flutter (23419): AppLifecycleState.paused
从后台，进入前台，他的状态变化是：AppLifecycleState.resumed
I/flutter (23419): 实时Frame绘制回调
I/OpenGLRenderer(23419): Initialized EGL, version 1.4
I/flutter (23419): 实时Frame绘制回调
I/flutter (23419): AppLifecycleState.resumed
I/flutter (23419): 实时Frame绘制回调
class Page1 extends StatefulWidget {
Page1({super.key});
_Page1State createState() => _Page1State();
}
class _Page1State extends State<Page1> with WidgetsBindingObserver{
//当Widget第一次插入到Widget树时会被调用。对于每一个State对象，Flutter只会调用该回调一次
@override
void initState() {
super.initState();
print("page1 initState......");
WidgetsBinding.instance.addObserver(this);//注册监听器
WidgetsBinding.instance.addPostFrameCallback((_){
print("单次Frame绘制回调");//只回调一次
});
WidgetsBinding.instance.addPersistentFrameCallback((_){
print("实时Frame绘制回调");//每帧都回调
});
}
@override
void setState(fn) {
super.setState(fn);
print("page1 setState......");
}
/*
*初始化时，在initState之后立刻调用
*当State的依赖关系发生变化时，会触发此接口被调用
*/
@override
void didChangeDependencies() {
super.didChangeDependencies();
print("page1 didChangeDependencies......");
}
//绘制界面
@override
Widget build(BuildContext context) {
print("page1 build......");
return Scaffold(
appBar: AppBar(title: Text("Lifecycle demo")),
body: Center(
child: Column(
children: <Widget>[
ElevatedButton(
child: Text("打开/关闭新页面查看状态变化"),
onPressed: ()=> Navigator.push(
context, MaterialPageRoute(builder: (context) => Parent()),
),
)
],
),),
);
}
//状态改变的时候会调用该方法,比如父类调用了setState
@override
void didUpdateWidget(Page1 oldWidget) {
super.didUpdateWidget(oldWidget);
print("page1 didUpdateWidget......");
}
//当State对象从树中被移除时，会调用此回调
@override
void deactivate() {
super.deactivate();
print('page1 deactivate......');
}
//当State对象从树中被永久移除时调用；通常在此回调中释放资源
@override
void dispose() {
super.dispose();
print('page1 dispose......');
WidgetsBinding.instance.removeObserver(this);//移除监听器
}
//监听App生命周期回调
@override
void didChangeAppLifecycleState(AppLifecycleState state) async {
print("$state");
if (state == AppLifecycleState.resumed) {
//do sth
}
}
}
帧绘制回调
除了需要监听 App 的生命周期回调做相应的处理之外，有时候我们还需要在组件渲染之后做一些与显示安全相关的操作。
在 Android 开发中，我们可以通过 View.post() 插入消息队列，来保证在组件渲染后进行相关操作。 WidgetsBinding 提供了单次 Frame 绘制回调，以及实时 Frame 绘制回调两种机制，来分别满足不同的需求： 单次 Frame 绘制回调，通过 addPostFrameCallback 实现。它会在当前 Frame 绘制完成后进行进行回调，并且只会回调一次，如果要再次监听则需要再设置一次。
WidgetsBinding.instance.addPostFrameCallback((_){
print("单次Frame绘制回调");//只回调一次
});
实时 Frame 绘制回调，则通过 addPersistentFrameCallback 实现。这个函数会在每次绘制 Frame 结束后进行回调，可以用做 FPS 监测。
WidgetsBinding.instance.addPersistentFrameCallback((_){
print("实时Frame绘制回调");//每帧都回调
});
