Flutter 生命周期/渲染原理

[toc]

生命周期

生命周期的基本概念

基本概念
- 生命周期的本质是回到方法（函数），实现这个方法去监听它的生命周期！
- 让你知道封装好的这个 Widget 它处于什么样的状态了！
有什么作用
- 监听 Widget 的事件
- 初始化数据
  - 创建数据
  - 发送网络请求
- 内存管理
  - 销毁数据、销毁监听者
  - 销毁 timer 等等

Widget 的生命周期

Stateless

1. 构造方法
1. build方法

class MyHomePage extends StatelessWidget {
  final String title;
  MyHomePage({this.title}) {
      print('构造函数被调用了');
  }
  @override
  Widget build(BuildContext context) {
    print('build 方法被调用');
    return Container();
  }
}

Stateless

从上面的打印我们可以看出，stateless 的构造方法先被调用，之后才调用 build 方法；这里 AS 打印了两次，是因为 AS 本身的 bug，不用理会，我们可以直接用 Xcode 或者命令行运行一下项目，可以看到是打印了一次，大家可以自行操作看下，这里就不多说了。

Stateful（包含两个对象 Widget、state）
- Widget 构造方法
- Widget 的 CreateState 方法
- State 的构造方法
- State 的 initState 方法
- State 的 build 方法
  - 当调用 setState 方法，就会重新调用 build 方法进渲染！
- 当Widget 销毁的时候，调用 State 的 Dispose 方法

   class MyHomePage extends StatefulWidget {
     final String title;
     MyHomePage({this.title}) {
       print('构造函数被调用了');
     }
     @override
     _MyHomePageState createState() => _MyHomePageState();
   }
   
   class _MyHomePageState extends State<MyHomePage> {
     _MyHomePageState() {
       print('State的构造方法来了！');
     }
     @override
     void initState() {
       print('state 的 init 方法来了！');
       super.initState();
     }
     @override
     Widget build(BuildContext context) {
       print('state 的 build 方法来了！');
       return Center(
         child: Text(widget.title),
       );
     }
     @override
     void dispose() {
       print('state 的Dispose 方法来了！');
       // TODO: implement dispose
       super.dispose();
     }
   }

Stateful.png