7
\$\begingroup\$

I have multiple UI Sprites that have their alpha set so you can see what's behind them. I would like to make these UI Sprites ignore other UI Sprites.

So take this first picture. There are 4 UI Sprites that overlay over a part of each other.

Note: These sprites can appear in a random location and the number is unknown, so I thought a Shader would make sense for this.

enter image description here

I would like to still adjust their alpha, but I would like them to ignore each other so that they appear to be 1 image like below.

enter image description here

I tried modifying a Shader, but I couldn't work it out.

// Unity built-in shader source. Copyright (c) 2016 Unity Technologies. MIT license (see license.txt) Shader "UI/Default" { Properties { [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {} _Color ("Tint", Color) = (1,1,1,1) _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 [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) = 0 } SubShader { Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "PreviewType"="Plane" "CanUseSpriteAtlas"="True" } Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } Cull Off Lighting Off ZWrite Off ZTest [unity_GUIZTestMode] Blend SrcAlpha OneMinusSrcAlpha ColorMask [_ColorMask] Pass { Name "Default" CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma target 2.0 #include "UnityCG.cginc" #include "UnityUI.cginc" #pragma multi_compile __ UNITY_UI_CLIP_RECT #pragma multi_compile __ UNITY_UI_ALPHACLIP struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; UNITY_VERTEX_INPUT_INSTANCE_ID }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; float2 texcoord : TEXCOORD0; float4 worldPosition : TEXCOORD1; UNITY_VERTEX_OUTPUT_STEREO }; fixed4 _Color; fixed4 _TextureSampleAdd; float4 _ClipRect; v2f vert(appdata_t v) { v2f OUT; UNITY_SETUP_INSTANCE_ID(v); UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT); OUT.worldPosition = v.vertex; OUT.vertex = UnityObjectToClipPos(OUT.worldPosition); OUT.texcoord = v.texcoord; OUT.color = v.color * _Color; return OUT; } sampler2D _MainTex; fixed4 frag(v2f IN) : SV_Target { half4 color = (tex2D(_MainTex, IN.texcoord) + _TextureSampleAdd) * IN.color; #ifdef UNITY_UI_CLIP_RECT color.a *= UnityGet2DClipping(IN.worldPosition.xy, _ClipRect); #endif #ifdef UNITY_UI_ALPHACLIP clip (color.a - 0.001); #endif return color; } ENDCG } } } 
\$\endgroup\$
2
  • 1
    \$\begingroup\$ I answered the same question here \$\endgroup\$ Commented May 2, 2018 at 13:18
  • \$\begingroup\$ @SeyedMortezaKamali Thanks. I did look for a few days to a solution, but I guess my search terms were incorrect. \$\endgroup\$ Commented May 2, 2018 at 14:39

1 Answer 1

9
\$\begingroup\$

Just change your Stencil like below Image:

Image

Stencil Op/Comparison Values

Comparison Functions

0 - Always 1 - Never 2 - Less 3 - Equal 4 - LEqual 5 - Greater 6 - NotEqual 7 - GEqual 8 - Always // (This is the default for the UI shaders so I suspect this one is technically the 'correct' Always, but any value beyond it will also count as Always) 

Stencil Operations

0 - Keep 1 - Zero 2 - Replace 3 - IncrSat 4 - DecrSat 5 - Invert 6 - IncrWrap 7 - DecrWrap 

References: unity forum & khronos


Adding Enum to Inspector

It's hard to remember above stencil number so you can use enum

Image

change your properties like this:

[Enum(UnityEngine.Rendering.CompareFunction)] _StencilComp ("Stencil Comparison", Int) = 3 [Enum(UnityEngine.Rendering.StencilOp)] _StencilOp ("Stencil Operation", Int) = 3 

useful link : configurableStencil shader


Final Result

Final Result

\$\endgroup\$
3
  • \$\begingroup\$ Oh wow. Didn't think it was that easy. Been working on a solution for a few days, didn't know a few inspector changes would do that. Thanks for links, will definitely read up on those, and thanks for a simple solution. \$\endgroup\$ Commented May 2, 2018 at 14:40
  • \$\begingroup\$ @SeyedMortezaKamali I've tried your answer provided both in this post and here. It works like a charm... however at the same time it breaks Unity built-in masking (SpriteMask and rect-based Mask). I've created a post on Unity forums about that here My project uses the Universal Render Pipeline and Unity 2019.3. Any advice on how to handle this? \$\endgroup\$ Commented May 2, 2020 at 10:58
  • \$\begingroup\$ @JanMysior: it looks to me like this would be a new question worth its own Question post. Click the "Ask Question" button in the top right to get started. \$\endgroup\$ Commented May 2, 2020 at 12:22

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.