美文网首页
2. Flutter 之 Widget(生命周期)

2. Flutter 之 Widget(生命周期)

作者: Aliv丶Zz | 来源:发表于2021-03-11 21:39 被阅读0次

      Widget其实就是Flutter的组件、控件,在Flutter中万物皆Widget;在我们iOS或者Android开发中,我们的界面有很多种类的划分:应用(Application)、视图控制器(View Controller)、活动(Activity)、View(视图)、Button(按钮)等等;但是在Flutter中,这些东西都是不同的Widget而已;

      在Flutter开发中,我们可以继承StatelessWidget或者StatefulWidget来创建自己的Widget类;

    StatelessWidget: 没有状态改变的Widget,通常这种Widget仅仅是做一些展示工作而已;数据通常是直接写死
    StatefulWidget: 需要保存状态,并且可能出现状态改变的Widget;

    1. StatelessWidget 写法

    1、让自己创建的Widget继承自StatelessWidget;
    2、StatelessWidget包含一个必须重写的方法:build方法;

    class MyStatelessWidget extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return <返回我们的Widget要渲染的Widget,比如一个Text Widget>;
      }
    }
    

    2. StatefulWidge 写法

    Flutter将StatefulWidget设计成了两个类:
    1、一个类继承自StatefulWidget,作为Widget树的一部分;
    2、一个类继承自State,用于记录StatefulWidget会变化的状态,并且根据状态的变化,构建出新的Widget;

    class MyStatefulWidget extends StatefulWidget {
      @override
      State<StatefulWidget> createState() {
        // 将创建的State返回
        return MyState();
      }
    }
    
    class MyState extends State<MyStatefulWidget> {
      @override
      Widget build(BuildContext context) {
        return <构建自己的Widget>;
      }
    }
    
    build方法的解析:

    Flutter在拿到我们自己创建的StatelessWidget时,就会执行它的build方法;
    我们需要在build方法中告诉Flutter,我们的Widget希望渲染什么元素,比如一个Text Widget;
    StatelessWidget没办法主动去执行build方法,当我们使用的数据发生改变时,build方法会被重新执行;

    build方法什么情况下被执行呢?:

    1、当我们的StatelessWidget第一次被插入到Widget树中时(也就是第一次被创建时);
    2、当我们的父Widget(parent widget)发生改变时,子Widget会被重新构建;
    3、如果我们的Widget依赖InheritedWidget的一些数据,InheritedWidget数据发生改变时;

    3. Widget生命周期

    Flutter小部件的生命周期:
      StatelessWidget可以由父Widget直接传入值,调用build方法来构建,整个过程非常简单;
      StatefulWidget需要通过State来管理其数据,并且还要监控状态的改变决定是否重新build整个Widget;
    所以,我们主要讨论StatefulWidget的生命周期,也就是它从创建到销毁的整个过程;

    3.1 StatelessWidget生命周期

    1、执行StatelessWidget的构造函数(Constructor)来创建出StatelessWidget;
    2、 执行build方法

    3.2 StatefulWidget生命周期

    StatefulWidget本身由两个类组成的:StatefulWidget和State,我们分开进行分析

    • 首先,执行StatefulWidget中相关的方法:

    1、执行StatefulWidget的构造函数(Constructor)来创建出StatefulWidget;
    2、执行StatefulWidget的createState方法,来创建一个维护StatefulWidget的State对象;

    • 其次,调用createState创建State对象时,执行State类的相关方法:

    1、执行State类的构造方法(Constructor)来创建State对象;
    2、执行initState,我们通常会在这个方法中执行一些数据初始化的操作,或者也可能会发送网络请求
    3、执行didChangeDependencies方法,这个方法在两种情况下会调用
      情况一:调用initState会调用;
      情况二:从其他对象中依赖一些数据发生改变时
    4、Flutter执行build方法,来看一下我们当前的Widget需要渲染哪些Widget;
    5、当前的Widget不再使用时,会调用dispose进行销毁;

    • 另外

    6、手动调用setState方法,会根据最新的状态(数据)来重新调用build方法,构建对应的Widgets;
    7、执行didUpdateWidget方法是在当父Widget触发重建(rebuild)时,系统会调用didUpdateWidget方法

    相关文章

      网友评论

          本文标题:2. Flutter 之 Widget(生命周期)

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