前言
在游戏开发时，我们为了让角色更加真实立体，我们会使用 3D 模型代替 2D 的龙骨或者 Spine 动画。
比如我们的选择角色的界面，如果我们的角色是 3D 模型，界面的 UI （例如名字、背景图等）都是 2D 的，那么我们怎么实现 3D 模型和界面的 UI 一起渲染在同一个界面呢？换句话说，我们怎么实现把 3D 模型渲染在 UI 上呢？
思路
使用 Creator 引擎提供的 UIMeshRenderer 组件。
介绍
引擎的渲染流程（渲染管线）：
- 引擎在渲染 3D 和渲染 UI 是分开的，并不是同时渲染的。
- 按照引擎默认的渲染管线（前向 forward 渲染管线）的流程是，引擎会先渲染 3D 后渲染 UI。
- 结合 Camera 的特性，越早渲染的会优先绘制。所以最终的表现是，如果 3D 和 UI 放在一起渲染的话，那么 UI 会盖在 3D 的上面（3D 模型被 UI 盖住了看不到了，或者显示不全）
这是由于 3D 和 UI 放在一起，会导致一些渲染的问题，所以如果我们能把 3D 模型的数据提交延迟到和 UI 一起提交，那么我们就可以实现 UI 和 3D 模型一起渲染的效果。所以我们需要借助今天的主角“UIMeshRenderer”。
Creator 官方文档的介绍是，UIMeshRenderer 是一个将 3D 模型从 3D 渲染管线转换到 2D 渲染管线的带有转换功能的渲染组件。该组件支持 3D 模型和粒子在 UI 上的显示，没有这个组件，即使模型和粒子节点在 UI 里也不会被渲染。
这是来自 Creator 3.5.2 版本的引擎代码 ui-meshrenderer.ts 中部分。
实现步骤
- 以 Creator 3.5.2 版本为例，我们新建一个场景，把 3D 模型和 UI 素材导入到项目下。
- 将 UI 和 3D 模型拖到层级管理器上。3D 模型也放置在 Canvas 路径下。player 为我们的 3D 模型。
- 在 player 节点上的 MeshRenderer 组件下，挂载我们的 UIMeshRenderer 组件。（挂载 UIMeshRenderer 组件的方式，我们可以通过 属性编辑器上的 添加组件，然后选择 UIMeshRenderer 即可）
备注： - 需要为每个 MeshRenderer 组件挂载 UIMeshRenderer 组件；
- 当拖拽 3D 模型或者 UI 到层级管理器上运行时不显示时，检查一下节点的 Layer 选项。默认的 Layer 可能为 DEFAULT，而相机的 Visibility 选项在 Canvas 下默认是 UI_2D 和 UI_3D 是勾选的，可能会导致运行时不被渲染（剔除）。修改的方式：一种是修改节点的Layer 为相机 Camera 的 Visibility 选项；一种是将相机的 Visibility 选项勾选 DEFAULT 选项。
- 节点的 layer 是和相机的 Visibility 选项配合使用，共同解决哪些物体需要被渲染，那么物体不被渲染。
介绍到这里，实现 3D 渲染到 UI 上的方法是不是很简单。
思考题
这边介绍的是 3D 模型，那么如果是个骨骼动画呢？怎么使用 UIMeshRenderer 组件呢？
[关注我，了解更多 Cocos Creator 用法]
更多参考可以访问
Cocos Creator 3.5.x demo 版本
https://gitee.com/yeshao2069/CocosCreatorDemos/tree/v3.5.x/demo/2d/Creator3.5.0_UIMeshRenderer
Cocos Creator 3.4.x demo 版本
https://gitee.com/yeshao2069/CocosCreatorDemos/tree/v3.4.x/demo/Creator3.4.2_UIMeshRenderer
Cocos Creator 3.0.x demo 版本
https://gitee.com/yeshao2069/CocosCreatorDemos/tree/v3.0.x/demo/Creator3.0.0_UIMeshRenderer
[如果喜欢，可以点个 gitee 关注和 star 哟，谢谢哟]