1、简介
画布 (Canvas) 是应该容纳所有 UI 元素的区域。画布是一种带有画布组件的游戏对象，所有 UI 元素都必须是此类画布的子项。
画布 使用 EventSystem 对象来协助消息系统。
2、绘制元素的顺序
画布中的 UI 元素按照它们在 Hierarchy 中显示的顺序绘制。首先绘制第一个子项，然后绘制第二个子项，依此类推。如果两个 UI 元素重叠，则后一个元素将显示在前一个元素之上。
要更改元素的显示顺序，只需在 Hierarchy 中拖动元素进行重新排序。也可以通过在变换组件上使用以下方法从脚本控制顺序：SetAsFirstSibling、SetAsLastSibling 和 SetSiblingIndex。
3、渲染模式
用于在屏幕空间或世界空间中进行渲染。
● Screen Space - Overlay
此渲染模式将 UI 元素放置于在场景之上渲染的屏幕上。如果调整屏幕大小或更改分辨率，则画布将自动更改大小来适应此情况。
● Screen Space - Camera
类似于 Screen Space - Overlay，但在此模式下，画布放置在指定 摄像机 前面的给定距离处。UI 元素由此摄像机渲染，这意味着摄像机设置会影响 UI 的外观。如果摄像机设置为 正交视图，则 UI 元素将以透视图渲染，透视失真量可由摄像机__视野__控制。如果调整屏幕大小、更改分辨率或摄像机视锥体发生改变，则画布也将自动更改大小来适应此情况。
● World Space
在此渲染模式下，画布的行为与场景中的所有其他对象相同。画布大小可用矩形变换进行手动设置，而 UI 元素将基于 3D 位置在场景中的其他对象前面或后面渲染。此模式对于要成为世界一部分的 UI 非常有用。这种界面也称为 ” 叙事界面 ( diegetic interface ) “。
4、Canvas
画布 (Canvas) 组件表示进行 UI 布局和渲染的抽象空间。所有 UI 元素都必须是附加了画布组件的游戏对象的子对象。
4.1、属性
| 属性 | 功能 |
|---|---|
| Render Mode | UI 在屏幕上或作为 3D 空间对象进行渲染的方式 ● Screen Space - Overlay：UI 渲染在场景对象上 ● Screen Space - Camera：UI 的前面有场景对象 ● World Space：UI 与场景对象相交 |
| Pixel Perfect（仅限 Screen Space 模式） | 是否应该无锯齿精确渲染 UI？ |
| Render Camera（仅限 Screen Space - Camera 模式） | 应该将 UI 渲染到的摄像机 |
| Plane Distance（仅限 Screen Space - Camera 模式） | UI 平面在摄像机前方的距离 |
| Event Camera（仅限 World Space 模式） | 用于处理 UI 事件的摄像机 |
| Receives Events | 此画布是否处理 UI 事件？ |
4.2、Render Mode
所有 UI 元素使用一个画布就足够了，但场景中可以有多个画布。此外，为了实现优化目的，还可以使用嵌套的画布，使一个画布作为另一个画布的子项。嵌套的画布使用与其父项相同的渲染模式。
● Screen Space - Overlay 设置
在此模式下，画布会进行缩放来适应屏幕，然后直接渲染而不参考场景或摄像机（即使场景中根本没有摄像机，也会渲染 UI）。如果更改屏幕的大小或分辨率，则 UI 将自动重新缩放进行适应。UI 将绘制在所有其他图形（例如摄像机视图）上。
注意： Screen Space - Overlay 画布需要存储在层级视图的顶级。如果未使用此设置，则 UI 可能会从视图中消失。这是一项内置的限制。请将 Screen Space - Overlay 画布保持在层级视图的顶级以便获得期望的结果。
● Screen Space - Camera 设置
在此模式下，画布的渲染效果就好像是在摄像机前面一定距离的平面对象上绘制的效果。UI 在屏幕上的大小不随距离而变化，因为 UI 始终会重新缩放来准确适应摄像机视锥体。如果更改屏幕的大小或分辨率或更改摄像机视锥体，则 UI 将自动重新缩放进行适应。场景中比 UI 平面更靠近摄像机的所有 3D 对象都将在 UI 前面渲染，而平面后的对象将被遮挡。
● World Space 设置
此模式将 UI 视为场景中的平面对象进行渲染。但是，与 Screen Space - Camera 模式不同，该平面不需要面对摄像机，可以根据喜好任意定向。画布的大小可以使用矩形变换来设置，但画布在屏幕上的大小将取决于摄像机的视角和距离。其他场景对象可以位于画布后面、穿透画布或位于画布前面。
提示：
- 请在 创建 World Space UI 页面上阅读有关设置世界空间画布 (World Space Canvas) 的更多信息。
- 如需了解如何使画布和 UI 缩放到不同的分辨率或宽高比，请参阅 设计用于多种分辨率的 UI 页面以及 画布缩放器 (Canvas Scaler) 页面。
5、Canvas Scaler
画布缩放器 (Canvas Scaler) 组件用于控制画布中 UI 元素的整体缩放和像素密度。此缩放会影响画布下的所有内容，包括字体大小和图像边框。
**● UI Scale Mode 属性：**确定画布中的 UI 元素的缩放方式
- Constant Pixel Size：无论屏幕大小如何，UI 元素都保持相同的像素大小
- Scale With Screen Size：屏幕越大，UI 元素越大
- Constant Physical Size：无论屏幕大小和分辨率如何，UI 元素都保持相同的物理大小
5.1、Constant Pixel Size
无论屏幕大小如何，UI 元素都保持相同的像素大小。
此模式可在屏幕上按像素指定 UI 元素的位置和大小。这也是画布在未附加任何画布缩放器时的默认功能。但是，借助画布缩放器中的“Scale Factor”设置，可以向画布中的所有 UI 元素应用常量缩放。
| 属性 | 功能 |
|---|---|
| Scale Factor | 按此系数缩放画布中的所有 UI 元素 |
| Reference Pixels Per Unit | 如果精灵具有此“Pixels Per Unit”设置，则精灵中的每个像素将覆盖 UI 中的一个单位 |
5.2、Scale With Screen Size
屏幕越大，UI 元素越大。
此模式可以根据指定参考分辨率的像素来指定位置和大小。如果当前屏幕分辨率大于参考分辨率，则画布会保持只具有参考分辨率的分辨率，但是会放大以便适应屏幕。如果当前屏幕分辨率小于参考分辨率，则画布会相应缩小以适应屏幕。
如果当前屏幕分辨率的宽高比与参考分辨率不同，则单独缩放每个轴以适应屏幕会形成非一致缩放，通常不希望发生这种情况。相反，ReferenceResolution 组件会使画布分辨率偏离参考分辨率，以便遵循屏幕的宽高比。可以使用 Screen Match Mode 设置控制此偏离的行为方式。
| 属性 | 功能 |
|---|---|
| Reference Resolution | UI 布局设计的目标分辨率（如果屏幕分辨率较大，则 UI 会放大，如果较小，则 UI 会缩小） |
| Screen Match Mode | 在当前分辨率的宽高比不适应参考分辨率时，用于缩放画布区域的模式 |
| ● Match Width or Height | 以宽度、高度或二者的某种平均值作为参考来缩放画布区域 |
| ● Expand | 水平或垂直扩展画布区域，使画布不会小于参考 |
| ● Shrink | 水平或垂直裁剪画布区域，使画布不会大于参考 |
| Match | 确定是否以宽度、高度或二者的某种平均值作为参考进行缩放 |
| Reference Pixels Per Unit | 如果精灵具有此“Pixels Per Unit”设置，则精灵中的每个像素将覆盖 UI 中的一个单位 |
5.3、Constant Physical Size
无论屏幕大小和分辨率如何，UI 元素都保持相同的物理大小。
此模式可按物理单位（如毫米、点或派卡）指定 UI 元素的位置和大小。此模式要求设备正确报告其屏幕 DPI。对于不报告 DPI 的设备，可以指定回退 DPI。
| 属性 | 功能 |
|---|---|
| Physical Unit | 用于指定位置和大小的物理单位 |
| Fallback Screen DPI | 在屏幕 DPI 未知时采用的 DPI |
| Default Sprite DPI | 用于精灵的每英寸像素，使其“Pixels Per Unit”设置与“Reference Pixels Per Unit”设置匹配 |
| Reference Pixels Per Unit | 如果精灵具有此“Pixels Per Unit”设置，则其 DPI 将与“Default Sprite DPI”设置匹配 |
5.4、World Space Canvas
画布 (Canvas) 组件设置为 World Space 时显示
此模式可以使用画布缩放器来控制画布中 UI 元素的像素密度。
| 属性 | 功能 |
|---|---|
| Dynamic Pixels Per Unit | 用于 UI 中动态创建的位图（如文本）的每单位像素量 |
| Reference Pixels Per Unit | 如果精灵具有此“Pixels Per Unit”设置，则精灵中的每个像素将覆盖世界中的一个单位 如果“Reference Pixels Per Unit”设置为 1，则精灵中的“Pixels Per Unit”设置将按原样使用 |
6、Canvas Group
画布组 (Canvas Group) 可集中控制整组 UI 元素的某些方面，而无需单独处理每个元素。画布组的属性会影响所在的游戏对象以及所有子对象。
6.1、属性
| 属性 | 功能 |
|---|---|
| Alpha | 此组中的 UI 元素的不透明度 该值介于 0 和 1 之间，其中 0 表示完全透明，1 表示完全不透明 请注意，UI 元素也会保留自己的透明度，因此画布组的 Alpha 值将与各个元素的 Alpha 值彼此相乘 |
| Interactable | 确定此组件是否接受输入（当设置为 false 时，禁用交互） |
| Block Raycasts | 此组件是否作为射线投射的碰撞体？ 需要在连接到画布的图形射线投射器上调用 RayCast 函数（这_不_适用于 Physics.Raycast） |
| Ignore Parent Groups | 此组还会受到游戏对象层级视图中更上层的画布组 (Canvas Group) 组件中的设置所影响，还是会忽略并因此覆盖这些设置？ |
6.2、典型用途
- 通过在窗口的游戏对象上添加画布组并控制其 Alpha 属性来淡入或淡出整个窗口。
- 通过将画布组添加到父游戏对象并将其 Interactable 属性设置为 false 来使整组控件不可交互（“灰显”）。
- 通过在 UI 元素或其某个父元素上放置画布组 (Canvas Group) 组件并将其 Block Raycasts 属性设置为 false 来使一个或多个 UI 元素不阻止鼠标事件。
7、Canvas Renderer
画布渲染器 (Canvas Renderer) 组件用于渲染 画布(Cavas) 中包含的图形 UI 对象。
画布渲染器在 Inspector 中没有公开属性。
菜单 (GameObject > Create UI) 中提供的标准 UI 对象全部都可以在任何需要的地方附加画布渲染器，但对于自定义 UI 对象，可能需要手动添加此组件。虽然 Inspector 中没有公开属性，但可通过脚本访问一些属性和函数；请参阅脚本参考中的 CanvasRenderer 页面以了解完整的详细信息。