flutter-State的生命周期

2021-03-30 本文已影响0人浮华_du

image.gif

initState：当Widget第一次插入到Widget树时会被调用，对于每一个State对象，这个方法只会调用一次。所以，通常在该回调中做一些一次性的操作，如一些初始化操作。(注意:不能在该回调中调用BuildContext.inheritFromWidgetOfExactType（该方法用于在Widget树上获取离当前widget最近的一个父级InheritFromWidget），原因是在初始化完成后，Widget树中的InheritFromWidget也可能会发生变化，所以正确的做法应该在在build（）方法或didChangeDependencies()中调用它。)
didChangeDependencies()：当State对象的依赖发生变化时会被调用；例如：在父widget的build() 中如果包含一个InheritedWidget，然后在之后InheritedWidget发生了变化，那么此时InheritedWidget的子widget的didChangeDependencies()回调都会被调用。
build：它主要是用于构建Widget子树
reassemble：此回调是专门为了开发调试而提供的，在热重载(hot reload)时会被调用，此回调在Release模式下永远不会被调用。
didUpdateWidget：在widget重新构建时，Flutter framework会调用Widget.canUpdate来检测Widget树中同一位置的新旧节点，然后决定是否需要更新，如果Widget.canUpdate返回true则会调用此回调。正如之前所述，Widget.canUpdate会在新旧widget的key和runtimeType同时相等时会返回true，也就是说在在新旧widget的key和runtimeType同时相等时didUpdateWidget()就会被调用。
deactivate：当State对象从树中被移除时，会调用此回调。在一些场景下，Flutter framework会将State对象重新插到树中，如包含此State对象的子树在树的一个位置移动到另一个位置时（可以通过GlobalKey来实现）。如果移除后没有重新插入到树中则紧接着会调用dispose()方法。
dispose：当State对象从树中被永久移除时调用；通常在此回调中释放资源。

class LifeCyclePage extends StatefulWidget {
  @override
  _LifeCyclePageState createState() => _LifeCyclePageState();

  @override
  StatefulElement createElement() {
    // print("page1--createElement");
    return super.createElement();
  }
}

class _LifeCyclePageState extends State<LifeCyclePage>
    with WidgetsBindingObserver {
  String title = "点击我";

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print('page1--initState');
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    print(state.toString());
  }

  @override
  void didChangeDependencies() {
    print('page1--didChangeDependencies');
    super.didChangeDependencies();
  }

  @override
  void didUpdateWidget(LifeCyclePage oldWidget) {
    print('page1--didUpdateWidget');
    super.didUpdateWidget(oldWidget);
  }

  @override
  Widget build(BuildContext context) {
    print('page1--build');
    return Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text("生命周期示例"),
      ),
      body: Column(
        children: <Widget>[
          GestureDetector(
            child: new Text(title ?? ""),
            onTap: () {
              setState(() {
                title = "我变化了";
              });
            },
          ),
         ChildStatefulWidget(),
          FlatButton(
              color: Colors.grey,
              onPressed: () {
                Navigator.of(context)
                    .push(new MaterialPageRoute(builder: (BuildContext c) {
                  return new LifeCyclePage2();
                }));
              },
              child: Text("跳转页面")),
        ],
      ),
    );
  }

  @override
  void reassemble() {
    // TODO: implement reassemble
    super.reassemble();
    print('page1--reassemble');
  }

  @override
  void deactivate() {
    // TODO: implement deactivate
    super.deactivate();
    print('page1--deactivate');
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    //WidgetsBinding.instance.addObserver(this);
    print('page1--dispose');
  }
}

class ChildStatefulWidget extends StatefulWidget {
//  当这个 Widget 首次插入到树中时，框架会调用其 createState 函数以创建一个新的_ChildStatefulWidgetState实例来与该树中的相应位置关联
//  当这个widget的父级重建时，父级将创建一个新的ChildStatefulWidget实例，但是Flutter框架将重用已经在树中的_ChildStatefulWidgetState实例，
//  而不是再次调用createState创建一个新的State。
  @override
  _ChildStatefulWidgetState createState() {
    print("child--createState");
    return _ChildStatefulWidgetState();
  }
}

class _ChildStatefulWidgetState extends State<ChildStatefulWidget> {
  String title = "点击我";

  @override
  Widget build(BuildContext context) {
    print('child--build');
    return GestureDetector(
      child: new Text(title ?? ""),
      onTap: () {
        setState(() {
          title = "我变化了";
        });
      },
    );
  }

  @override
  void initState() {
    print('child--initState');
    super.initState();
  }

  @override
  void didChangeDependencies() {
    print('child--didChangeDependencies');
    super.didChangeDependencies();
  }

  @override
  void didUpdateWidget(ChildStatefulWidget oldWidget) {
    print('child--didUpdateWidget');
    super.didUpdateWidget(oldWidget);
  }

  @override
  void reassemble() {
    print('child--reassemble');
    super.reassemble();
  }

  @override
  void deactivate() {
    print('child--deactivate');
    super.deactivate();
  }

  @override
  void dispose() {
    print('child--dispose');
    super.dispose();
    //WidgetsBinding.instance.addObserver(this);
  }
}

class LifeCyclePage2 extends StatefulWidget {
  @override
  _LifeCyclePageState createState(){
    return new _LifeCyclePageState();
  }

  @override
  StatefulElement createElement() {
    // TODO: implement createElement
//    print("page2--createElement");
    return super.createElement();
  }
}

class _LifeCyclePageState extends State<LifeCyclePage2> with WidgetsBindingObserver {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print('page2---initState');
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    print(state.toString());
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();
    print('page2---didChangeDependencies');
  }

  @override
  void didUpdateWidget(LifeCyclePage2 oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
    print('page2---didUpdateWidget');
  }

  @override
  Widget build(BuildContext context) {
    print('page2---build');
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text("生命周期示例2"),
      ),
    );
  }

  @override
  void reassemble() {
    // TODO: implement reassemble
    super.reassemble();
    print('page2---reassemble');
  }

  @override
  void deactivate() {
    // TODO: implement deactivate
    super.deactivate();
    print('page2---deactivate');
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    //WidgetsBinding.instance.addObserver(this);
    print('page2---dispose');
  }
}

进入页面1:
I/flutter (26059): page1--initState
I/flutter (26059): page1--didChangeDependencies
I/flutter (26059): page1--build
I/flutter (26059): child--createState
I/flutter (26059): child--initState
I/flutter (26059): child--didChangeDependencies
I/flutter (26059): child--build

点击第一个"点击我": setState
I/flutter (26059): page1--build
I/flutter (26059): child--didUpdateWidget
I/flutter (26059): child--build

点击第二个"点击我":
I/flutter (26059): child--build

跳转页面2:
I/flutter (26059): page2---initState
I/flutter (26059): page2---didChangeDependencies
I/flutter (26059): page2---build

返回页面1:
I/flutter (26059): page2---deactivate
I/flutter (26059): page2---dispose

退出页面1:
I/flutter (26059): page1--deactivate
I/flutter (26059): child--deactivate
I/flutter (26059): child--dispose
I/flutter (26059): page1--dispose

flutter-State的生命周期

猜你喜欢

热点阅读