Cocos3.x2D和3D混合的UIUIMeshRenderer
本⽂参照官⽅⽂档，涉及camera可以参考Cocos 3.0 camera
⼀、2D 对象概述
区别于 3D 模型对象，我们将不涉及模型的图⽚渲染体统称为 2D 渲染对象。2D 渲染对象的处理在底层的数据提交上与 3D 模型存在差异，其遵循⾃⼰的规则做出了⼀些针对性的调整以实现更好的效率表现和使⽤体验。
1.RenderRoot2D
2D 渲染对象的收集采⽤树状结构，RenderRoot 节点（带有 RenderRoot2D 组件的节点）为 2D 对象数据收集的⼊⼝节点，所有的 2D渲染对象需在 RenderRoot 节点下才可以被渲染。rotate属性
由于 Canvas 组件本⾝继承 RenderRoot2D 组件，所以 Canvas 组件也可以作为数据收集的⼊⼝。2D 渲染节点必须带有 UITransform 组件作为渲染顶点数据、点击或者对齐策略等功能⽣效的必要条件。
2D 渲染也可以⽀持对模型进⾏渲染，唯⼀的条件是带有模型组件（例如 MeshRenderer/SkinnedMeshRenderer）的节点必须添加
UI/UIMeshRenderer 组件才可以和 UI 在相同的管线上进⾏渲染。
引擎中所有不拥有的 model 的渲染对象都为 2D 渲染对象。与 3D 对象不同，2D 对象本⾝不拥有 model 信息，其顶点信息是由
UITransform 组件的 Rect 信息持有并由引擎创建的，且本⾝没有厚度。由于引擎的设计要求，2D渲染对象需要为 RenderRoot 节点（带有RenderRoot2D 组件的节点）的⼦节点才能完成数据的收集操作。
所以 2D 渲染对象的渲染要求有两点：
需要有 UITransform 组件
需要为 RenderRoot 节点的⼦节点
2.2D 渲染对象可见性说明
由于 2D 渲染对象在 Camera 的可见性判断上和 3D 渲染节点并⽆区别，所以⽤户需要⾃⼰控制节点的 layer 属性并设置 Camera 的 Visibility 来配合进⾏分组渲染，如果场景中出现多个相机的情况，错误的 layer 设置导致节点重复渲染或不渲染。
这⾥请 3D 1.2 版本升级的⽤户注意，我们纠正了之前的 Canvas 只会渲染其⼦节点的⾏为，⽬前需要⽤户⾃⼰管理节点的 layer 和相机的Visibility，之前使⽤了多 Canvas 渲染的⽤户可能会需要对项⽬做出调整以达到更合理的场景结构。
⼆、渲染排序说明
2D 渲染节点可分为在 Canvas 下的节点和不在 Canvas 下的节点两种，在 Canvas 下的节点可参考下⽂的 UI 节点排序。 对于不在 Canvas 下的节点，⽤户可选择通过⾃定义材质来开启深度检测实现和 3D 物体的遮挡显⽰，开启后则会按照物体的 Z 轴坐标进⾏遮挡渲染（可参考范例2d-rendering-in-3d（GitHub | Gitee）。没有开启深度检测的话，则数据提交依旧会按照节点树顺序提交，也就意味着节点树靠下的节点会后渲染。
image.png
OpenGL学习笔记⼗⼆（深度测试）
OpenGL ES 学习教程(⼗⼆) DEPTH_TEST(深度缓冲测试)
当我们渲染多个物体时，这多个物体之间存在互相遮挡的关系，被遮挡的物体的部分将不可见，也就是它离相机更远，为了告诉计算机被遮挡的物体不需要渲染，我们就需要对物体上的点做深度测试，检测它是否需要渲染。
为了实现上述的检测，就需要深度缓冲，简单⽽⾔就是存储物体上点深度值的数组，这个数组⼀开始值为0，当⽬前渲染的物体的深度值⼤于缓冲区中存储的深度值时，就将这个值写⼊缓冲区，同时通过深度测试，如果与此相反，深度值⼩于缓冲区中的深度值，就是未通过深度测试，且不写⼊缓冲区，淘汰掉这个点（不做渲染）。
透明物体的深度写⼊问题
【关于cocos creator的渲染的提议】
1.UI 节点排序
UI 节点特指在 Canvas 节点下的 UI 节点，这些节点并未开启深度测试，所以节点的混合是严格按照节点树进⾏排序的。UI 的渲染排序采⽤的是⼀个深度优先的排序⽅式，每⼀个 UITransform 组件⾝上都有⼀个 priority 属性，根据 priority 的值来调整节点顺序。排序从根节点下的⼦节点开始，根据⼦节点的优先级来确定整体的渲染结构，也就是根节点下的⼦节点的排序已经决定了最终的渲染顺序。每⼀个节点下的所有⼦节点的 priority 则⽤来确定在当前节点下的渲染顺序。直接修改了 priority 也会直接改变节点树顺序。
举个例⼦：
image.png
因此，上图中整体的渲染顺序则是：B -> b1 -> C -> A -> a1 -> a2，在屏幕上的呈现状态为：a2 -> a1 -> A -> C -> b1 -> B。
注意事项
排序是⼀个很简单的功能，但是最终的呈现却是根据不同平台提供的渲染能⼒来的。因此，在这⾥说明⼀下，如果遇到了 UI 渲染出错，花屏，闪屏等现象，⾸先要检查的就是场景⾥所有相机（Camera 和 Canvas）的 ClearFlag，确保 场景⾥必须有⼀个相机要执⾏ Solid_Color 清屏操
image.png image.png
image.png
image.png
注：使⽤双相机时，注意调节3D物体的SCALE，太⼩了可能看不到
DepthTest可以参考
cocosCreator3.2.0 Skeleton的深度写⼊问题
三、UI Me s hRe nd e r e r
UIMeshRenderer 是⼀个将 3D 模型从 3D 渲染管线转换到 2D 渲染管线的带有转换功能的渲染组件。该组件⽀持 3D 模型和粒⼦在 UI 上的显⽰，没有这个组件，即使模型和粒⼦节点在 UI ⾥也不会被渲染。
该组件的添加⽅式是在 层级管理器 中选中带有或继承⾃ MeshRenderer 组件的节点，然后点击 属性检查器 下⽅的 添加组件 按钮，选择 UI-> UIMeshRenderer 即可。⽽粒⼦则是添加到粒⼦节点上。通常结构如下所⽰：
image.png
注意，如果结点是多层结构，则每⼀层带有或继承⾃ MeshRenderer 组件的节点，都要添加UIMeshRenderer。如果运⾏后看不到，需要检查canvas中Camera的visibility设置。
四、3D模型显⽰在2D⽰例
1.UIMeshRenderer ⽅式

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。