浅谈Unity中的Canvas及三种渲染模式

浅谈Unity中的Canvas及三种渲染模式

橙子前言

最近在搞Unity的性能优化&＃xff0c;涉及到Canvas这个方面了&＃xff0c;想着单独拿出来&＃xff0c;给大家讲讲Canvas这个东西&＃xff0c;到底是什么&＃xff0c;以便于解开新手小白心中的疑惑。
当然&＃xff0c;如果你是0基础&＃xff0c;就先看看怎么用&＃xff0c;此教程对于入门级适用。

提示&＃xff1a;以下是本篇文章正文内容&＃xff0c;下面案例可供参考

一、Canvas是什么&＃xff1f;

Canvas&＃xff1a;翻译后的解释为&＃xff1a;画布
我理解的是&＃xff1a;使用UGUI来进行UI开发&＃xff0c;离不开Canvas组件&＃xff0c;所有的 UI 元素&＃xff0c;要么自己包含 Canvas 组件&＃xff0c;要么是 Canvas 组件所在 GameObject 的子节点。

二、如何创建 Canvas

你在 Hierarchy 视图右击空白处->UI->Canvas可以直接创建一个 Canvas&＃xff0c;然后添加其他 UI 元素作为其子节点。

三、Canvas 组件的RenderMode 参数

1.Screen Space - Overlay 模式

Canvas 覆盖屏幕&＃xff0c;且永远覆盖在其它元素的上层&＃xff0c;也就是说 UI 会遮挡场景中的其它元素。

当 RenderMode 为 Screen Space - Overlay时&＃xff0c;Canvas的其它参数包括&＃xff1a;

• Pixel Perfect&＃xff1a;UI元素精确到像素对齐&＃xff0c;边缘更清晰&＃xff0c;但是在UI调整和适配时会有更大的计算量&＃xff08;个人理解&＃xff09;
• Sort Order&＃xff1a;Canvas 的深度。多个 存在多个Canvas时&＃xff0c;Sort Order 值更大的Canvas会遮盖住 Sort
  Order 值小的 Canvas
• 注&＃xff1a;多个 Canvas 深度取值相等时&＃xff0c;Hierarchy 视图中后面的 Canvas 显示在下&＃xff0c;这一点与 UI
  元素&＃xff08;如Image的规则相反&＃xff09;

2.Screen Space - Camera 模式

和 Overlay 模式相仿&＃xff0c;Canvas覆盖整个屏幕空间画布也是填满整个屏幕空间。不同之处在于&＃xff0c;Canvas 被放置于指定摄像机的前方。

这种模式下面 UI 并不一定能渲染在 3d 元素之上

且

1. 必须在摄像机的远近平面之间才会被渲染
2. 即使摄像机是 Perspective 模式&＃xff0c;Canvas 距离摄像机的远近依然不会影响其显示大小
3. 其它3元素可以和 Canvas 产生遮挡关系&＃xff0c;距离摄像机更近的元素会遮盖住 Canvas 上面的 UI
4. 摄像机的缩放/平移/旋转&＃xff0c;以及 fov 的变化&＃xff0c;不会影响 Canvas 显示结果&＃xff0c;Canvas
   永远是放置在距离摄像机视口一定距离的地方&＃xff0c;且与摄像机水平视线垂直

Screen Space - Camera 的参数包括&＃xff1a;

• Pixel Perfect &＃xff1a;同 Overlay 模式含义
• Render Camera &＃xff1a;指定的用来渲染 Canvas 的摄像机
• Plane Distance&＃xff1a;Canvas 平面距离摄像机的距离
• Sorting Layer&＃xff1a;指示 Canvas 的深度&＃xff0c;可以手动添加。当存在多个模式为 Screen Space 的 Canvas
  时&＃xff0c;Sorting Layer 决定了显示的优先级。
• Order in Layer&＃xff1a;多个 Canvas 具有相同的 Sorting Layer 时&＃xff0c;根据 Order in Layer
  来确定显示优先级。

3.World Space 模式

此种模式下&＃xff0c;Canvas 与场景中其它3D元素没有区别

此时

• Canvas 可以调整 RectTransform 的数值
• 摄像机的平移旋转缩放及fov都会影响 Canvas 的显示
• 需要 EventCamera 来指定接受事件的摄像机

四、总结

1. 不同模式的 Canvas之间&＃xff0c;Screen Space - Overlay 的 Canvas 永远显示在最前面&＃xff0c;Screen Space
   -Camera 和 World 的显示关系决定于 World Canvas 距离摄像机的位置以及 Screen Space - Camera Canvas 的 Plane Distance

2. 相同的 Screen Space - Overlay Canvas &＃xff1a;显示优先级由 Sort Order 确定

3. 相同的 Screen Space - Camera&＃xff1a;显示优先级由 Sorting Layer 和 Order in Layer 确定

五、结束语

不及硅步&＃xff0c;无以至千里。
不积小流&＃xff0c;无以成江海。
每天进步一点点 谢谢您的观看。

觉得对自己有帮助&＃xff0c;欢迎关注、收藏、转发&＃xff01;我们下期再见