注：本文同步发布于微信公众号：stringwu的互联网杂谈 Flutter的一些概念(二)
1 flutter的核心渲染模块
当应用启动时flutter 会遍历所有的Widget 形成Widget 树，并通过 createElement 方法创建每个element 对象，最后通过 createRenderObject 方法创建 renderobject 对象
1.1 Widget
Widget 树作来描述UI结构，很轻量，
1.2 Element
Element同时持有Widget和RenderObject 会存放一些上下文信息，，支撑UI 结构
1.3 RenderObject
Render 控制实际的布局和绘制，保存元素的大小和布局等信息，实例化一个 RenderObject 是非常耗时的。
2 Layer 和SceneBuilder的区别与联系
在 Flutter中， SceneBuilder和 Layer都是渲染流程中的关键概念,是紧密相关的，它们一起工作来构建应用程序的UI。当用户操作应用程序时， SceneBuilder会根据用户输入来更新 Scene，并生成新的 Layer。然后， Flutter将这些 Layer传递给GPU或CPU进行渲染，从而生成最终的UI Layer 和 SceneBuilder 都是渲染流程中的关键概念，它们是构建和渲染 UI 的一部分；
2.1 Layer
Layer 树是渲染树的一部分，但它与 Widget 树不同，因为 Layer 树是专门用于渲染的。 Layer 是一个抽象类，代表了屏幕上的一块区域。在 Flutter 的渲染流程中， Widget 首先被转换成 Element，然后 Element 被转换成 RenderObject，最终 RenderObject 被转换成 Layer。 Flutter 中有几种不同类型的 Layer，包括但不限于：
- ContainerLayer：一个简单的层，没有任何视觉内容，但可以包含其他层。
- PictureLayer：包含 Skia 图形引擎的 Picture 对象，用于绘制图形。
- OpacityLayer：可以设置子层的透明度。
- TransformLayer：可以对子层进行变换操作，如旋转、缩放、平移等。
- ClipRectLayer、ClipRRectLayer 和 ClipPathLayer：用于裁剪子层，只显示特定形状内的区域。
2.2 SceneBuilder
SceneBuilder 是一个在构建阶段用来构建 Scene 对象的工具类。 Scene 对象代表了整个 Flutter应用的渲染树，包括所有的 Layer。 SceneBuilder 提供了一系列方法来添加、修改和删除 Layer，构建最终的渲染输出。 SceneBuilder 的使用通常涉及以下步骤：
- 创建
SceneBuilder实例：开始构建过程。 - 添加
Layer：使用addRect、addPicture、addTexture等方法添加不同类型的 Layer。 - 构建
Scene：通过调用 build 方法完成 Scene 的构建。 - 提交渲染：将构建好的 Scene 提交给渲染引擎进行渲染。
首先由 UI 线程构建 Widget 树，然后通过 Renderer 将 Widget 树转换成 RenderObject 树，接着 RenderObject 树被转换成 Layer 树。最后，使用 SceneBuilder 构建 Scene，并提交给渲染引擎进行渲染。
3 几个关键字之间的联系
mixin implements extends这三个关键字在 Dart中可同时存在，其中 mixin 混入，多个类层次结构中复用类代码的方法，使用 mixin的条件
- mixins类只能继承自object
- mixins 不能有构造函数
- implements 实现接口
- extends 继承
4 widget的分类
- 绘制类：
RenderObjectWidget,相关的方法调用顺序为：layout -> performResize -> performLayout -> markNeedsPaint - 代理类，inheritedWidget 和 ParentDataWidget,一般用 于状态的共享
- 组合类：StatelesWidget 和
StatefulWidget
5 参考
公众号二维码：
