Flutter
从 Paint 到 Compositing:Layer 树构建与 Scene 生成底层机制
Waitwalker2026-08-2413 min
## 1. 为什么需要 Layer 树?
在复杂的 UI 中,并非所有绘制内容都在一个平面上直接画出。透明度 (Opacity)、剪裁 (Clip)、变换 (Transform) 等操作需要独立的离屏图层进行 GPU 混合(Compositing)。
## 2. PaintingContext 与 Layer 生成流程
```dart
// PaintingContext 源码级概念
void pushLayer(ContainerLayer childLayer, PaintingContextCallback painter, Offset offset) {
// 挂载新的子图层
currentLayer.append(childLayer);
// 在新图层上下文中继续绘制
painter(newContext, offset);
}
```
最终,根 Layer 树会调用 `buildScene()` 生成底层的 `ui.Scene` 对象,直接投递给 Raster 线程送往 GPU。
#Flutter#Layer#Compositing#渲染管线
回到文章列表 →