特效和UI的层级关系
特效和UI是在同一个Camera下，同一个SortingLayer下显示的，
但是，UI是在Canvas下统一管理渲染的，特效不是。
从其组件的父类继承关系也可看出来：
- Canvas : Behaviour : Component，需要RectTransform组件
- UI组件都继承自Graphic，属于UnityEngine.UI命名空间
- 特效ParticleSystem继承自Component，Component继承自Object
- 特效ParticleSystem必然带有MeshRenderer组件
- SpriteRenderer 继承自Render，Render继承自Component
- MeshRenderer 继承自Render
- 只要是Render，就有SortingLayer和OrderInLayer属性
同一个Canvas下渲染层级是一样的，所以特效是无法插入到两UI之间的
可以在需要显示在特效上的UI加一个Canvas，重载OrderInLayer属性，使其大于特效的OrderInLayer。
如果这个UI上又要显示新的特效，则新特效层级OrderInLayer需要比这个UI的高才行。
所以需要设计一套框架，实现以下效果
- 1、可以在任意层级添加特效，弹出的新UI会覆盖在特效之上
- 2、特效要支持mask裁切
- 3、拓展一下，其他Render也可以显示在UI层级之间；并且支持mask裁切
Mask裁切
要支持Mask裁切应该涉及到shader
1、UI自带的Mask裁切原理(可以看浅谈Unity uGUI Mask组件实现原理)
Masking is implemented using the stencil buffer of the GPU.
要让自带的Mask支持特效裁切，在特效的shader里加入如下代码即可。
_StencilComp ("Stencil Comparison", Float) = 8
_Stencil ("Stencil ID", Float) = 0
_StencilOp ("Stencil Operation", Float) = 0
_StencilWriteMask ("Stencil Write Mask", Float) = 255
_StencilReadMask ("Stencil Read Mask", Float) = 255
Stencil
{
Ref [_Stencil]
Comp [_StencilComp]
Pass [_StencilOp]
ReadMask [_StencilReadMask]
WriteMask [_StencilWriteMask]
}
2、自定义的UIMask裁切原理
雨松的方案
原理就是把Mask的裁切区域传给粒子特效Shader，当超出这个区域那么直接让它完全透明即可。粒子特效的源生shader大家可以去unity官网下载，我在这里把需要修改的地方标注给大家。
另一个方案（未测试）
拜读大神博客久矣。 一直仰慕！在下有一个方法可以更便捷的解决以上问题，也是我偶然翻查国外论坛找到的。创建两个Shader，一个给粒子用，一个给UI Mask 用,两个Shader的内容均采用Build-in Shader的Particle-Additive 和 UI-Default。利用Shader 的 Stencil 功能， 分别对两个Shader加入以下内容：//UI Mask Stencil { Ref 1 Comp Always Pass Replace }//Paritcle Stencil { Ref 1 Comp equal }之后分别创建相应材质球，将其赋予UIImage 和 想被遮罩的 Particle 即可。 如果看不见效果，调整一下Particle的位置。 亲测可用。
我们项目中的方案
我们自己使用了一套Shader，UI-Default-Optimized.shader、UI-Default-Gray.shader等，然后要使用我们自己的UIMask，与系统的Mask不兼容。
系统的方案是使用Stencil，我们的方案是根据MaskRect区域改透明度
据说使用Stencil比较耗性能
我们的UIMask不支持不规则图形的裁切，只是用来裁切ScrollView滚动视界的区域
网友评论