UGUI—Canvas下的三种渲染模式以及各自的应用场景

在Canvas下有三种渲染模式，分别是：Screen Space-Overlay、Screen Space-Camera、World Space。

下面来详细介绍一下这三种渲染模式。

第一种：Screeb Space-Overlay(屏幕空间，覆盖模式)

作用：

     该模式下的画布会填满整个屏幕空间，并将画布下面的所有UI元素置于屏幕最上方，此模式下画布会直接缩放来适应屏幕，然后直接渲染而不参考场景或者相机(即使场景中根本没有相机也会渲染UI)，如果屏幕的大小或者分辨率发生改变，画布将自动改变大小来自适应。

应用场景：

使用于简单的UI元素的显示。

注意事项:

• 该模式下的3D物体无法被Main Camera照射到，所以无法看到。
• 该模式下不需要摄像机也可以看到画布上的2D组件。

参数详解：

Screen Space-Overlay渲染模式的画布有Pixel Perfect和Sort Layer两个参数：

• Pixel Perfect：(仅限屏幕空间拥有)

       作用：决定UI元素是否有抗锯齿效果，勾选后的效果即使UI元素边缘清晰不模糊。

• Sort Layer：(仅限此模式拥有)

       作用：用于设置画布的深度。例如两个Canvas，sort order更大的越后渲染，UI元素也就     越在其他Canvas下元素的前面。

第二种：Screen Space-Camera(屏幕空间，摄影机模式)

作用：

• 与Screen Space-Overlay相类似，画布放在指定摄像机的特定位置处。
• UI元素是由摄像机来渲染的，UI外观与摄像机的设置有关。如果摄像机设置为了正交视图，那么UI元素将会展示为透视图，透视失真量是由摄像机的视野来控制。
• 如果屏幕的大小、分辨率或者是摄像机视锥体发生改变，画布也会自适应。场景中比UI平面更靠近摄像机的所有3D对象都将在UI前面渲染，而平面后的对象将被遮挡。

应用场景：

这种模式可以用来实现在UI上显示3D模型的需求，比如左侧显示装备界面，右侧显示人物。

参数详解：

• Render Camera

       设置渲染摄像机(把需要渲染的摄像机拖到这里

• Plane Distance

       设置画布与摄像机的距离

     ** 注意：**

• •   一旦这个距离设定，相机和画布的相对距离永远不会改变，如果拖动摄像机，那么画布也会跟着移动。
  • 更改这个距离的大小，可以控制3D物体和2D物体出现在画布(屏幕)的前后

• Sorting Layer

UGUI专用设置，可以用来指定画布的深度。例如两个Canvas，Sorting Layer更大的越后渲染，UI元素也就 越在其他Canvas下元素的前面。

• Order in Layer

Order in Layer是Sort Layer的细分，当Sort Layer相同时，Order in Layer越大的越后渲染。

第三种：World-Space(世界空间模式)

作用：

画布的行为与场景中其他对象一样，类似于一张面片(Plane)，并且可以在通过RectTransorm手动设置画布大小和位置及其旋转角度(前面两种模式不可以)，其UI元素是根据其3D位置所在的场景中其他对象前面或者后面渲染。适应于要称为世界一部分的UI。这种界面也称之为”叙事界面”。

应用场景：

这种模式可以用来实现跟随任务移动的血条或者名称。

参数详解:

• Event Camera

用来指定接收事件的摄像机，可以通过画布上的GraphicRaycaster组件发射射线产生的事件。

• Sorting Layer

UGUI专用设置，可以用来指定画布的深度。例如两个Canvas，Sorting Layer更大的越后渲染，UI元素也就 越在其他Canvas下元素的前面。

• Order in Layer

Order in Layer是Sort Layer的细分，当Sort Layer相同时，Order in Layer越大的越后渲染。

三种渲染模式的区别: