1、Fultter 生命周期
生命周期的作用:
- 初始化一些数据、变量、状态
- 发送网络请求
- 监听事件
- 管理内存
1.1 StatelessWidget 生命周期
class MSHomePage extends StatelessWidget {
MSHomePage() {
print("Flutter: StatelessWidget 构造函数 调用");
}
@override
Widget build(BuildContext context) {
print("Flutter: StatelessWidget build 调用");
return Text("Hello World");
}
}
StatelessWidget 不可变,在它的生命周期中,只会执行构造函数、build方法
1.2 StatefulWidget 生命周期
在下图中,灰色部分的内容是Flutter内部操作的,我们并不需要手动去设置它们;
白色部分表示我们可以去监听到或者可以手动调用的方法
首先,执行StatefulWidget中相关的方法:
1、执行StatefulWidget的构造函数(Constructor)来创建出StatefulWidget;
2、执行StatefulWidget的createState方法,来创建一个维护StatefulWidget的State对象;
其次,调用createState创建State对象时,执行State类的相关方法:
1、执行State类的构造方法(Constructor)来创建State对象;
2、执行initState,我们通常会在这个方法中执行一些数据初始化的操作,或者也可能会发送网络请求;
注意:这个方法是重写父类的方法,必须调用super,因为父类中会进行一些其他操作;
并且如果你阅读源码,你会发现这里有一个注解(annotation):@mustCallSuper
3、执行didChangeDependencies方法,这个方法在两种情况下会调用
情况一:调用initState会调用;
情况二:从其他对象中依赖一些数据发生改变时,比如前面我们提到的InheritedWidget(这个后面会讲到);
4、Flutter执行build方法,来看一下我们当前的Widget需要渲染哪些Widget;
5、当前的Widget不再使用时,会调用dispose进行销毁;
6、手动调用setState方法,会根据最新的状态(数据)来重新调用build方法,构建对应的Widgets;
7、执行didUpdateWidget方法是在当父Widget触发重建(rebuild)时,系统会调用didUpdateWidget方法
1.2.1 代码演示
import 'package:flutter/material.dart';
void main(List args) {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
State createState() => _MyAppState();
}
class _MyAppState extends State {
var curHomePage = MSHomePageBody();
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("声明周期"),
),
body: curHomePage,
floatingActionButton: IconButton(
icon: Icon(Icons.change_circle),
onPressed: () {
setState(() {
curHomePage = MSHomePageBody();
});
},
),
),
);
}
}
class MSHomePageBody extends StatefulWidget {
MSHomePageBody() {
print("1. MSHomePageBody 构造函数");
}
@override
State createState() {
print("2. MSHomePageBody createState");
return _MSHomePageBodyState();
}
}
class _MSHomePageBodyState extends State {
int _counter = 0;
_MSHomePageBodyState() {
print("3. _MSHomePageBodyState 构造函数");
}
@override
void initState() {
print("4. _MSHomePageBodyState initState");
super.initState();
}
@override
void didChangeDependencies() {
// 调用时机
// 调用initState会调用
// 从其他对象中依赖一些数据发生改变时
print("_MSHomePageBodyState didChangeDependencies");
super.didChangeDependencies();
}
@override
void didUpdateWidget(covariant MSHomePageBody oldWidget) {
// 调用时机
// 当父Widget触发重建(rebuild)时,系统会调用didUpdateWidget方法
print("_MSHomePageBodyState didUpdateWidget");
super.didUpdateWidget(oldWidget);
}
@override
Widget build(BuildContext context) {
print("5. _MSHomePageBodyState build");
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ElevatedButton(
onPressed: () {
setState(() {
_counter++;
});
},
child: Text(
"点击",
style: TextStyle(fontSize: 20),
),
),
Text(
"当前计数$_counter",
style: TextStyle(fontSize: 20),
),
],
);
}
@override
void dispose() {
print("6. Flutter: _MSHomePageBodyState dispose");
super.dispose();
}
}
运行App时,打印如下:
flutter: 1. MSHomePageBody 构造函数
flutter: 2. MSHomePageBody createState
flutter: 3. _MSHomePageBodyState 构造函数
flutter: 4. _MSHomePageBodyState initState
flutter: _MSHomePageBodyState didChangeDependencies
flutter: 5. _MSHomePageBodyState build
我们手动改变counter状态(点击+按钮)时,打印如下
flutter: 5. _MSHomePageBodyState build
我们手动改变curHomePage状态(点击底部按钮)时,MSHomePageBody的父Widget发生改变,打印如下:
flutter: 1. MSHomePageBody 构造函数
flutter: _MSHomePageBodyState didUpdateWidget
flutter: 5. _MSHomePageBodyState build
1.3 生命周期的复杂版
1、mounted是State内部设置的一个属性。这个属性是在我们创建完State调用initState之前,Flutter给我们的BuildContent挂载的一个属性。这个属性最主要的作用是为了记录对应的Element是否为空
2、dirty state的含义是脏的State
它实际是通过Element的属性来标记的;
将它标记为dirty会等待下一次的重绘检查,强制调用build方法来构建我们的Widget;
3、clean state的含义是干净的State
它表示当前build出来的Widget,下一次重绘检查时不需要重新build;