flutter Widget和Element
2022-08-16 本文已影响0人
烟影很美
![](https://img.haomeiwen.com/i337235/289b42b85bfb2b5f.png)
![](https://img.haomeiwen.com/i337235/507b02557a1ab750.png)
- 图中忽略了很多函数
- 图中并没有包含子类对父类
override
简单总结:
-
RenderObjectWidget
与最终的渲染对象一一对应,内部包含了创建和更新RenderObject
的函数。 -
StatelessWidget
和StatefulWidget
与渲染无关,可以理解为逻辑上的Widget
,或者是RenderObjectWidget
的容器
,在build()
和state.build()
函数中最后还是要返回RenderObjectWidget
。 - 可以看到
Element
中包含非常多的函数,比如update()
、mount()
、inflateWidget()
等等,Element
组成树的结构管理着整个应用的渲染信息。
以热更新为例,整个过程都是在遍历(BuildOwner.buildScope()
内部)_dirtyElements
数组,然后调用Element.rebuild()
->Element.performRebuild
,如果是ComponentElement
,在performRebuild()
中就会通过build()
函数获取下一层的Widget
,通过判断其本身以及runtimeType
和key
决定复用旧的还是重新创建新的Element
,复用分两种,一种是直接使用_child
,另外则是通过_retakeInactiveElement(key, newWidget);
获得,然后将Widget
赋值给决策后的Element
。
新创建的Element
如果是ComponentElement
,在mount
过程中会运行_firstBuild()
,如果是RenderObjectElement
,在mount
过程中会运行createRenderObject()
。
如果遍历到RenderObjectElement
,依然调用Element.rebuild()
->Element.performRebuild
,在其performRebuild()
中调用updateRenderObject
。
Element
的build()
函数就是Widget
的build()
函数
- 可以看到,
RenderObject
只和RenderObjectWidget
、RenderObjectElement
一一对应。数量远远少于Widget
和Element
。
/>> 标题写的太大,之后如果有相关内容会修改。