前几天跟一个哥哥聊天,说到了UI上面粒子特效的裁剪,作为一个好久不写UI的同学来说,我根本没有意识到问题。。他跟我说的具体流程好像是,在粒子的片段处理时看看是不是在Mask的矩形内,来判断是否显示这个片段。我当时就感觉这丫太复杂了吧。。还要考虑适配,屏幕缩放。。万一我有多个空间需要裁剪怎么办。。今天就试了下用模板测试做这个裁剪。
我们知道UI的Mask原理无非就是Stencil,而且在UI的默认Shader里面也有这些设置
问题无非就是粒子没有模板处理。
这里只要让两个模板比较然后处理粒子的Pass就可以。比如让UI的先绘制,设置一下模板值
"Queue" = "Transparent"//这里其实UI/Default的默认队列就是Transparent
然后设置粒子的队列值大一点,在UI后面渲染,在比较模板值时,只有相等再Keep就可以。
UIMask的shader
Shader "Unlit/Mask"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_refVal("Ref Value", int) = 0 //模板值
}
SubShader
{
Tags { "RenderType"="Opaque" "Queue" = "Transparent" }
LOD 100
Pass
{
Stencil
{
Ref[_refVal]
Comp Always
Pass Replace
}
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
// make fog work
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0;
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = TRANSFORM_TEX(v.uv, _MainTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
// sample the texture
// fixed4 col = tex2D(_MainTex, i.uv);
// // apply fog
// UNITY_APPLY_FOG(i.fogCoord, col);
return fixed4(1,0,0,1);
}
ENDCG
}
}
}
需要裁剪的粒子Shader
Shader "Unlit/MaskChild"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_refVal("Ref Value", int) = 0 //模板值
}
SubShader
{
Tags { "RenderType"="Opaque" "Queue" = "Transparent + 1" }
LOD 100
Pass
{
Stencil
{
Ref[_refVal]
Comp Equal
Pass keep
}
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
// make fog work
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0;
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = TRANSFORM_TEX(v.uv, _MainTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
// sample the texture
fixed4 col = tex2D(_MainTex, i.uv);
// apply fog
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
模板测试还是当初老大教的。。想老大。。