美文网首页Dart & Flutter 相关
flutter-State的生命周期

flutter-State的生命周期

作者: 浮华_du | 来源:发表于2021-03-30 09:55 被阅读0次
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生命周期

    State 的生命周期和 StatefulWidget 不同,当 StatefulWidget 状态改变后就会被重...

  • flutter-State的生命周期

    initState:当Widget第一次插入到Widget树时会被调用,对于每一个State对象,这个方法只会调用...

  • flutter-state生命周期探索

    如今公司用flutter开发项目,写了几个月的业务,对于widget的生命周期也朦朦胧胧,如今得空来探知下。 测试...

  • Vue生命周期

    什么是生命周期方法?生命周期钩子=生命周期函数=生命周期事件 Vue生命周期方法分类  创建期间的生命周期方法: ...

  • 10,vue生命周期

    生命周期钩子=生命周期函数=生命周期事件 根据生命周期的不同分为三类: 创建阶段的生命周期 运行阶段的生命周期 销...

  • 微信小程序生命周期的记录

    小程序中生命周期分为3类: 应⽤的生命周期 页面的生命周期 组件的生命周期 一、生命周期 1. 应⽤的生命周期[h...

  • Lifecycle 生命周期源码解析

    目录: 什么生命周期 什么是生命周期感知型组件 Activity是如何把生命周期传给生命周期感知组件的 生命周期 ...

  • uni-app微信小程序开发 - 生命周期

    uni-app的生命周期分为应用生命周期和页面生命周期还有组件生命周期。 应用生命周期[https://uniap...

  • Activity,Fragment,Service生命周期图

    Activity生命周期 Fragment生命周期 Service生命周期

  • iOS 生命周期问题

    引言: 生命周期包括:a.程序的生命周期b.控制器的生命周期c.试图的生命周期 程序生命周期 a. 首次启动, 会...

网友评论

    本文标题:flutter-State的生命周期

    本文链接:https://www.haomeiwen.com/subject/crfihltx.html