核心#

• RenderObject: 所有渲染对象的基类，定义了布局和绘制的基本协议 1
• RenderBox: RenderObject的子类，实现了盒模型布局系统 4

常见#

文本

• RenderParagraph: 负责文本段落的渲染 2

布局

• RenderFlex: 实现弹性布局（如Row、Column）4
• RenderPadding: 处理内边距 1

图像

• RenderImage: 处理图片的渲染 4

过程#

1. 布局(Layout)

• 父节点向子节点传递约束(Constraints)
• 子节点在约束范围内确定自身大小 4

2. 绘制(Paint)

• 按照深度优先顺序遍历渲染树
• 将内容绘制到不同图层 4

3. 合成(Compositing)

• 由Flutter引擎负责将各个图层合成最终画面 4

性能优化#

渲染系统提供了两个重要的优化边界：

• 重新布局边界: 限制布局变化的传播范围
• 重绘边界: 限制重绘操作的影响范围 4