Ue4 UI优化文档整理理解

1.名词解释

User Widget：对应一个用户界面。

Widget Tree：每一个 User Widget 都是存储成树状结构。

Panel Widget：不会渲染出来，用于对 Child Widget 进行布局，如 Canva Panel, Grid Panel, Horizontal Box 等。

Common Widget：用于渲染，会生成到最后的 Draw Elements 中，如 Button, Image, Text 等。

 2.渲染流程

在游戏线程 （Game Thread），Slate Tick 每一帧会遍历两次 Widget Tree。

Prepass：从下到上遍历树，计算每一个Widget的理想尺寸 （Desired Size）。

OnPaint：从上到下遍历树，计算渲染所需的 Draw Elements 。这个过程中，会根据 Common Widget 的类型和参数生成相应的 Vertex Buffer，将 Common Widget 的 Render Transform 计算到 Vertex Buffer 中，并根据 Layer ID 和 Material 等信息进行批次合并。最后一个 User Widget 会生成1个或多个 Draw Element，并将 Draw Elements 传递给渲染线程进行渲染，其中每个 Draw Element 对应一个 Draw Call。

在渲染线程 （Render Thread），Slate 渲染分为两步：

Widget Render：执行 UI 的 RTT，如果使用了 Retainer Box，这里会将 Draw Elements 渲染到 Retainer Box 的 Render Target。

Slate Render：将 Draw Elements