首页 > Unity3D频道 > 【Unity3D研究院之游戏开发】 > Unity3D研究院之3D界面与2D界面的结合(一百二十四)
2021
02-06

Unity3D研究院之3D界面与2D界面的结合(一百二十四)

项目中已经全面采用3D与2D结合的方式来制作UI,3D界面的透视感会更强。但是有一部分UI还必须是不带透视的,所以需要采取正交与非正交摄像机结合的方式。3D界面有两种方式,第一种是需要进行屏幕自适应的,另一种不需要与屏幕自适应,我姑且把第一种称假3D界面,第二种称真3D界面。

Unity3D研究院之3D界面与2D界面的结合(一百二十四) - 雨松MOMO程序研究院 - 1

假3D界面的效果是,Image具有透视关系,旋转后有近大远小的效果,而且还能与屏幕进行自适应,做法很容易直接将Camera改成头摄像机就可以。

Unity3D研究院之3D界面与2D界面的结合(一百二十四) - 雨松MOMO程序研究院 - 2

此时对Image进行旋转就会有透视关系,而且还能与屏幕自适应。

Unity3D研究院之3D界面与2D界面的结合(一百二十四) - 雨松MOMO程序研究院 - 3

现在问题来了,如果场景有3D模型,比如给模型头顶要画一张图,图片和模型一样也需要有透视关系,这时候用假3D界面的就不行了,因为图片自适应以后就无法和模型的位置对上的,此时我们要引入一个新的方法纯3D界面。

为了让Image和3D物体坐标单位统一,首先把Canvas的Scale缩小100倍(UI被放大了100倍),然后将RenderMode改成WorldSpace

Unity3D研究院之3D界面与2D界面的结合(一百二十四) - 雨松MOMO程序研究院 - 4

这时候Image和Text不需要调整width和hight,缩放单位和Cube的3d世界单位完全一致

Unity3D研究院之3D界面与2D界面的结合(一百二十四) - 雨松MOMO程序研究院 - 5

无论真3D界面还是假3D界面,现在又面临一个问题,如果在同一摄像机同时看3D物体和UI就会产生渲染排序的问题,这会影响到Alpha Blend的结果。

半透明物体是不画深度的,对于UI来说全都是半透明,如果想做一种效果,背景图是UI,前面放个3D角色特效、最前面在放UI,这种叠层的方式就会出问题。因为UI是优先SortingOrder然后才是RenderQueue(在URP下是Priority)无论怎么改RenderQueue也得不到正确的结果

UI因为要处理层级就会修改Canvas的SortingOrder,这样界面的SortingOrder的值就比3D模型大,这就会先画3D模型,然后在画UI,最终显示结果就会出错。所以要给MeshRender修改它的SortingOrder,这样UI、粒子、模型全都统一了SortingOrder作为单位,就好调层级了。

最后就是摄像机的组合了,调整好顺序就万事大吉了。

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠写博客不易,如果您想请我喝一杯星巴克的话?就进来看吧!

Unity3D研究院之3D界面与2D界面的结合(一百二十四)》有 2 条评论

  1. 卢奕辛 说:

    大大 你的 这个 unity的 界面和字体 看着好舒服 请问下 怎么设置哦

留下一个回复

你的email不会被公开。