StatefulWidget-Lifecycle(生命周期)

• 这里主要讲解StatefulWidget的生命周期，StatelessWidget直接通过build构建完成。过程简单。
• StatefulWidget需要通过State来管理数据的更新，监听状态的变化来决定是否重新rebuild整个Widget。

StatefulWidget 有哪些生命周期回调？分别在什么情况下执行的？

• StatefulWIdget本身由两个类来组成：StatefulWidget 和 State
  • 首先执行StatefulWidget相关方法：
    • 1. StatefulWidget的构造器(Constructor)方法, 如HomeContent() {}
    • 2. StatefulWidget的createState() 方法来创建State实例
  • 然后执行State相关方法
    • 3. 开始执行State中的构造器(Constructor)的方法，如HomeContentState() {}
    • 4. 然后执行State中的initState() {} 方法，一般情况我们在这个方法里执行一些数据初始化操作或者网络请求
    • 5. 接着执行State中的didChangeDependencies 方法,
    • 6. 然后执行State中的Build方法来构建UI
    • 7. 当我们的widget不再使用的时候、就会调用State中的dispose() {} 方法
    • 8. 当我们手动调用setState(){} 方法就会调用build方法来rebuild构建新的Widget
    • 9. didUpdateWidget: 方法是在当父Widget触发重建（rebuild）时，系统会调用didUpdateWidget方法；

import ‘package:flutter/material.dart‘;

void main(List<String> args) {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text(‘首页‘),
        ),
        body: HomeContent(),
      ),
    );
  }
}

/*
StatefulWidget 生命周期:
// 首先执行StatefulWidget 相关方法：


*/

class HomeContent extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    print(‘2-执行createState方法创建state对象‘); // StatefulWidget第二个执行的创建State实例的方法
    return HomeContentState();
  }

  HomeContent() {
    print(‘1-执行HomeContent构造器方法‘); // 类的构造器方法第一个执行
  }
}

class HomeContentState extends State<HomeContent> {
  var _counter = 0;

  HomeContentState() {
    print(‘3-执行HomeContentState 构造器方法‘); // 类的构造器方法是该类第1个执行的
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print(‘4-执行了State方法中的initState方法‘); // state类的init方法第2个执行
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();
    print(‘5-执行了State方法中的didChangeDependencies方法‘); // state类的didChangeDependencies方法第3个执行
  }

  @override
  void didUpdateWidget(covariant HomeContent oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
    print(‘7-执行了state方法中的didUpdateWidget方法‘); // 这个方法待定！！！！
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    print(‘8-执行了State方法中的dispose方法‘); // 当这个widget不再使用的使用、就会调用这个方法
  }

  @override
  Widget build(BuildContext context) {
    print(‘6-执行了State方法中的build方法‘); // 开始执行build方法
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              RaisedButton(
                color: Colors.redAccent,
                child: Text(
                  ‘+1‘,
                  style: TextStyle(
                    fontSize: 20,
                    color: Colors.white,
                  ),
                ),
                onPressed: () {
                  print(‘+1‘);
                  _increase();
                },
              ),
              RaisedButton(
                color: Colors.orangeAccent,
                child: Text(
                  ‘-1‘,
                  style: TextStyle(
                    fontSize: 20,
                    color: Colors.white,
                  ),
                ),
                onPressed: () {
                  print(‘-1‘);
                  _decrease();
                },
              ),
            ],
          ),
          Text(
            ‘当前计数: $_counter‘,
            style: TextStyle(
              fontSize: 20,
              color: Colors.black,
              fontWeight: FontWeight.bold,
            ),
          )
        ],
      ),
    );
  }

  // 增加计数
  void _increase() {
    setState(() {
      _counter++;
    });
  }

  // 减少计数
  void _decrease() {
    setState(() {
      _counter--;
    });
  }
}

// 打印
flutter: 1-执行HomeContent构造器方法
flutter: 2-执行createState方法创建state对象
flutter: 3-执行HomeContentState 构造器方法
flutter: 4-执行了State方法中的initState方法
flutter: 5-执行了State方法中的didChangeDependencies方法
flutter: 6-执行了State方法中的build方法
手动调用-setState() {}， 再次rebuild方法触发
flutter: 6-执行了State方法中的build方法

原文：https://www.cnblogs.com/comefromchina/p/flutter-statefulewidget-lifecycle.html