unity 让自定义 ui shader 支持 UGUI 的 Mask 功能

本文介绍如何通过在Unity Shader中添加特定代码来支持UI Mask组件的功能。通过这些代码,可以实现自定义材质球的组件正确接受Mask组件的剔除效果,并提供了一种动态修改Mask下Image组件材质的方法。

unity论坛原文:
http://answers.unity3d.com/questions/980924/ui-mask-with-shader.html

关键的支持代码:

Shader "xxxxxx"
{
Properties
{
......

//MASK SUPPORT ADD
_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
_ColorMask ("Color Mask", Float) = 15
//MASK SUPPORT END

}

SubShader
{
Tags {...}

//MASK SUPPORT ADD
Stencil
{
    Ref [_Stencil]
    Comp [_StencilComp]
    Pass [_StencilOp] 
    ReadMask [_StencilReadMask]
    WriteMask [_StencilWriteMask]
}
ColorMask [_ColorMask]
//MASK SUPPORT END

......
}

在你的 shader 中加入这2段代码,剩下的部分照旧。这时我们再把这个 shader 赋给 ugui 组件的时候,就发现 mask 组件可以正确的剔除被我们更换过材质球的组件了。

PS:其实mask的主要功能,计算都在ui组件上了,加上这2段以后,我们就可以正确的接受外部传入进来的mask相关参数了,剩下的就是把它们剔除掉就好了。

补充一下:在支持mask之后,在Mask组件下的Image等组件的Material只有第一次赋值有效,如果想要能动态修改的话,就要新建一个脚本继承Image并重写GetModifiedMaterial方法。

解决Unity UI图片Shader模糊处理和Mask冲突,可借鉴解决灰度shadermask冲突的思路。因mask组件对shader的相关属性有要求,所以要在Shader中添加相关属性以符合要求,让模糊处理Shader能使用UGui里的Mask。 以下为具体操作,首先在`Properties`部分插入以下代码: ```glsl _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 _ColorMask ("Color Mask", Float) = 15 ``` 然后在`SubShader`部分插入以下代码: ```glsl Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } ColorMask [_ColorMask] ``` 示例Shader代码如下: ```glsl Shader "Custom/BlurWithMask" { Properties { [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {} _Color ("Tint", Color) = (1,1,1,1) // 模糊相关属性 _BlurSize ("Blur Size", Range(0, 10)) = 1 // 必须属性,用于UI.Mask _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 _ColorMask ("Color Mask", Float) = 15 } SubShader { Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "PreviewType"="Plane" "CanUseSpriteAtlas"="True" } // 必须部分,用于UI.Mask Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } ColorMask [_ColorMask] Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; half2 texcoord : TEXCOORD0; }; sampler2D _MainTex; fixed4 _Color; float _BlurSize; v2f vert(appdata_t IN) { v2f OUT; OUT.vertex = UnityObjectToClipPos(IN.vertex); OUT.color = IN.color * _Color; OUT.texcoord = IN.texcoord; return OUT; } fixed4 frag(v2f IN) : SV_Target { fixed4 c = tex2D(_MainTex, IN.texcoord); // 简单的模糊处理示例 float2 uv = IN.texcoord; fixed4 sum = fixed4(0,0,0,0); for (int x = -_BlurSize; x <= _BlurSize; x++) { for (int y = -_BlurSize; y <= _BlurSize; y++) { float2 offset = float2(x,y) * 0.001; sum += tex2D(_MainTex, uv + offset); } } c = sum / ((_BlurSize * 2 + 1) * (_BlurSize * 2 + 1)); c *= IN.color; return c; } ENDCG } } FallBack "Diffuse" } ```
评论 5
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值