Flutter 中 Widget 的生命周期说明

最新推荐文章于 2025-11-03 22:33:24 发布

原创最新推荐文章于 2025-11-03 22:33:24 发布 · 505 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android

Flutter 专栏收录该内容

1 篇文章

订阅专栏

这篇博客主要探讨了Flutter中StatelessWidget和StatefulWidget的生命周期，包括StatelessWidget的简单构建过程和StatefulWidget配合State类的复杂生命周期。在StatefulWidget中，State类的生命周期是重点，State对象可以在多个位置被创建，并通过setState()方法通知框架进行UI更新。

Widget的生命周期

在Flutter中，我们常用的widget有两种：

StatelessWidget，用于不需要维护状态的场景，它通常在build方法中通过嵌套其它Widget来构建UI，在构建过程中会递归的构建其嵌套的Widget。
StatefulWidget，用于需要随着触发事件改变UI的场景。

注意：这里所有的生命周期方法仅仅针对widget层以及以上，讨论render层级的方法。

StatelessWidget的生命周期

stateless_progress

StatefulWidget的生命周期

和StatelessWidget一样，StatefulWidget也是继承自Widget类，并重写了createElement()方法，不同的是返回的Element 对象并不相同；另外StatefulWidget类中添加了一个新的接口createState()。

下面我们看看StatefulWidget的类定义：

abstract class StatefulWidget extends Widget {
  const StatefulWidget({ Key key }) : super(key: key);
    
  @override
  StatefulElement createElement() => new StatefulElement(this);
    
  @protected
  State createState();
}

StatefulElement 间接继承自Element类，与StatefulWidget相对应（作为其配置数据）。StatefulElement中可能会多次调用createState()来创建状态(State)对象。
createState() 用于创建和Stateful widget相关的状态，它在Stateful widget的生命周期中可能会被多次调用。例如，当一个Stateful widget同时插入到widget树的多个位置时，Flutter 的 framework 就会调用该方法为每一个位置生成一个独立的State实例，其实，本质上就是一个StatefulElement对应一个State实例。

State的生命周期

一个StatefulWidget类会对应一个State类，State表示与其对应的StatefulWidget要维护的状态，State中的保存的状态信息可以：

在widget 构建时可以被同步读取。
在widget生命周期中可以被改变，当State被改变时，可以手动调用其setState()方法通知Flutter的 framework 有状态发生改变，Flutter的framework层在收到消息后，会重新调用其build方法重新构建widget树，从而达到更新UI的目的。

State中有两个常用属性：

widget，它表示与该State实例关联的widget实例，由Flutter 的framework动态设置。注意，这种关联并非永久的，因为在应用声明周期中，UI树上的某一个节点的widget实例在重新构建时可能会变化，但State实例只会在第一次插入到树中时被创建，当在重新构建时，如果widget被修改了，Flutter 的framework层会动态设置State.widget为新的widget实例。
context。StatefulWidget对应的BuildContext，作用同StatelessWidget的BuildContext。