整理Unity3d UGUI使用流程
整理Unity3d UGUI使用流程
记录UI界面层级多并使用大量动画和特效系统情况下,使用中遇到的一些问题和处理方法
Unity3d 版本为2018.4.4f1
. 基本设置
UI部分使用单独的摄像机来渲染
(以下称”Main Camera”为"主相机", “UI Camera”为"UI相机")
UI相机设置
1.设置Culling Mask只勾选UI ,保证只渲染到Layer设为UI的层级
2.Projection 设置成正交Orthographic ,避免可能调整Z轴的时候出现大小变化
3.Size 可以用默认值, 注意设置以后就不要再更改了,后期修改会影响到粒子系统特效尺寸
(设置粒子系统的缩放模式为Hierarchy就不会受Size影响了,后面做动画需要缩放带特效的UI也需要设置为Hierarchy)
4.Depth设置比主相机高就行,让其渲染在主相机画面上层
5.Occlusion Culling建议不勾, 勾选会导致使用Occlusion Culling剔除场景时如果UI相机在其中会被剔除部分UI显示. 或者将UI相机移出到Occlusion Culling的构建范围外,以免出现部分UI突然消失的问题
主相机取消UI的勾选, 以免UI被渲染两次,影响性能
Canvas我常用的设置(左),使用粒子系统的设置(右)
1.Canvas Scaler 设置如图, 主要是做适配
2.Reference Resolution 设置一个基准值,根据需要来设置. 跟横竖屏有关
3.Match是根据宽高适配的比例. 看游戏是做横屏还是竖屏. 0或1
4.或者代码动态调整横竖屏切换. 好像很少会有人去做横竖屏来回切换的游戏吧
一.Sorting Layers
Sorting Layers属于整体控制
1.设置Sorting Layers能大大避免前中后各层级UI界面之间的穿插问题. 层不够用的时候,分层的添加和修改都很方便
2.Sorting Layers 分得不宜太多. 层与层之间的UI不会进行合批渲染. 主要以背景层, 中间层, 最前面弹窗层为主, 中间层可以适当根据需要增加. 3-5个层级完全是够用的
3.也可以不使用Sorting Layers分层管理,只是为了管理方便
默认Default层, 只使用Order in Layer来排序也是可以的. 只是要留够足够的空间,0-30留给背景和特效,31-100留给中间和特效,100以上留给弹窗和特效. (为什么留这么多层,因为之前项目上使用unity官方的2D插件做人物动态动画,2D动画分层是使用Order in Layer排序的,角色分件太细会导致排序层不够用...) 使用Sorting Layers分层可以轻松解决这种问题
4.进行一个简单的Sorting Layers分层
给Canvas_Back,_Medium,_Front各加上个Canvas选择对应Sorting Layer,设置如下图
这样三层之间可以做到互不干扰
二. Particle System粒子系统使用
假如要给背景层加特效, 设置粒子Renderer的Sorting Layer 为Back, 用Order in Layer控制层级
粒子特效只在Back层内排序,不会影响到其他Sorting层级
给Canvas_Medium中间层小部件添加特效
一般这种小部件是复数的,作为单独的Prefab来动态加载,留个空挂点位置即可
Particle System的Renderer 设置Order in Layer来排列渲染顺序
出现夹在中间的Image时, 需要加个Canvas给图片排序,打断合批渲染
注意排序. 没有设置Order in Layer的都是以最上面的父级的层级设置为顺序
在任何Sorting Layer都可以使用这种方式排序Particle System, 不会影响到其他Sorting层级
Canvas_Front层一般作为弹窗提示类UI层级
可以使用中层同样的方式添加特效
除了使用粒子系统添加特效外, 还可以写Shader来实现一些特殊效果. Shader可以使用UI默认的正常排序,不用为了排序搞得那么复杂, 可以结合着用
注意使用Canvas排序会打断UI的合批渲染,造成draw call的增加
三. Animator控制UI动画
优点:
分工明确,程序控制简单,只用在交互的时候调用动画,美术制作方便,制作的时候运行动画就能方便预览效果,不用等程序写完代码提交才能看
简单拿窗口来说,把Animator添加到Canvas_Front上,下层建个空的AnimControl做为动画控制的空挂点. 空挂点下是动态加载的Prefab窗口
Prefab里还能加Animator控制窗口内的细节
建议使用空挂点,方便通用动画控制组件和动画. 动画不要直接操作UI元素,减少反复做同类动画
创建2个动画和一个空节点Null , 添加Int参数,通过传值来驱动动画
动画的一些设置.如下图
因为动画控制的是AnimControl这个空挂点,所以下方Prefab窗口是可以任意更换的.
缩放UI时特效大小不跟着变, 粒子系统缩放模式要设置为Hirerarchy, 制作特效的时候就应该修改好缩放模式
简单的带缩放的开关窗口就做好了,实际可以通过动画做很多节奏复杂的UI进场效果
四. 使用中遇到的问题
1. UGUI添加canvas组件调整UI渲染层级后需要点击交互的控件失效
在添加canvas组件后还要添加一个raycaster组件，这样才能触发对应的射线检测事件
2. 粒子系统不受mask组件遮罩
在控件的Viewport下新建一个空层添加上SpriteMask组件
Sprite 添加一张需要遮罩区域的形状图,调整Transform Z轴高于UI面板,调整Scale得到合适的尺寸
Custom Range控制遮罩的层级范围,这里粒子的Order 是6, 设置front为6 ,back为5即可, 多个粒子有排序的话,可以设置区间
Particle System的Renderer下Masking 要设置成Visable Inside Mask
这样粒子就获得了遮罩
这样做有个缺点,就是SpriteMask层级的尺寸是由Scale控制,不会随着自适应一起变大,固定大小的窗口没有问题
网上还有其他方法
1.通过获取Mask的裁切范围传给修改过的特效shader来获得遮罩
2.通过修改粒子系统Renderer模块,将粒子渲染到UI上等
3.还有一些其他问题, 忘记了,以后遇到了再补充进来
