Flutter中的StatelessWidget及其生命周期

级别: ★☆☆☆☆

标签:「Flutter」「StatelessWidget 」「生命周期 」
作者: 沐灵洛
审校: QiShare团队


StatelessWidget是什么?

继承自Widget,状态不可变,用于描述UI展示中相对固定的部分,如纯展示,不会被改变的UI。

abstract class StatelessWidget extends Widget {

  const StatelessWidget({ Key key }) : super(key: key);

  @override
  StatelessElement createElement() => StatelessElement(this);

 @protected
  Widget build(BuildContext context);
}
复制代码

通过其类的定义能够看到StatelessWidget配置StatelessElement

方法概述

  • build方法:

**描述:**用于描述当前widget所代表的UI。 调用时机: framework会使用build方法返回的widget注入当前StatelessElement或通过Widget.canUpdate选择合适的更新方式。 场景: build可能在如下三种场景会被调用。

  1. StatelessElement也可以说statelessWidget 首次插入树中时调用;
  2. Widget改变了StatelessElementwidget时,即通过StatelessElementupdate方法调用到。
  3. 它所依赖的InheritedWidget改变时。

总结

StatelessWidget通过StatelessWidget.createElement()创建了StatelessElementStatelessElement关联了StatelessWidget,并使用StatelessWidget配置自身。其中StatelessElement将其build方法通过关联的widget外放到StatelessWidget的实现中。因而他的生命周期依赖于StatelessElement,而StatelessElement的生命周期相对简单只有buildupdate

为了能更好的理解StatelessWidget的生命周期,我画了一张关于StatelessElementComponentElement的关系图。 StatelessElement、Component、Element的关系.png

关注我们的途径有:

QiShare(简书)
QiShare(掘金)
QiShare(知乎)
QiShare(GitHub)
QiShare(CocoaChina)
QiShare(StackOverflow)
QiShare(微信公众号)

Flutter中的Widget

Flutter中的Element(下篇)
Flutter中的Element(上篇)
iOS 解决 [NSURL fileURLWithPath:] 对 # 的编码问题
Xcode 调整导航目录字体大小b
Swift 5.1 (21) – 泛型
Swift 5.1 (20) – 协议
Swift 5.1 (19) – 扩展
Swift 5.1 (18) – 嵌套类型
Swift 5.1 (17) – 类型转换与模式匹配
浅谈编译过程
奇舞团安卓团队——aTaller
奇舞周刊
作者:QiShare
链接:https://juejin.cn/post/6864724677504270349
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片