I have a layer rendering issue, where the top layer of content will sometimes not render to screen as it appears that the bottom layer is rendering on top (even though it's behind in world space). It happens randomly, sometimes they render correctly.

Both layers are part of a UI button:

  • Front layer: the UI Text with the standard Font Material that Unity generated from the TTF font
    • z-index -10 (closer to the camera)
  • Back layer: Bg Quad with a custom shadered material in the Transparent render queue
    • z-index 0

Here's what it looks like in Scene view when the issue is present: enter image description here

Here's what it looks like without issue:

enter image description here

Again, in Game View with issue present: enter image description here

Game View without issue: enter image description here

I also made sure that the Bg game object is ordered first before the Text object in Hierarchy view to ensure that if the renderer is deciding which to render first based on hierarchy order, the bg will still be drawn first:

enter image description here

It seems like the shader rendering the background is not respecting the world space z-index, but I'm not sure why this happens at all, let alone only sometimes, seemingly randomly.

Here's the background shader, which is simply rendering a given color with possible alpha:

Shader "Custom/Color"
        _Color("Color", Color) = (1,1,1,1)
        Tags{ "RenderType" = "Transparent" "Queue" = "Transparent" }

        Blend SrcAlpha OneMinusSrcAlpha // Traditional transparency

            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            struct appdata
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;

            struct v2f
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;

            fixed4 _Color;

            v2f vert(appdata v)
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
                return o;

            fixed4 frag(v2f i) : SV_Target
                return _Color;

Any ideas why is this happening and how to stop it?

I imagine there's some kind of race condition in how Unity is deciding which layer to render first...

  • \$\begingroup\$ Can you clarify, is this artifact showing only in the scene view as you've shown? (The scene view does not guarantee proper z ordering of 2D content when you're viewing it in 3D perspective) Or do you also observe this button rendering out of order in the game view? If so, you should show that case. \$\endgroup\$
    – DMGregory
    Commented Dec 9, 2021 at 0:54
  • \$\begingroup\$ @DMGregory They render out of order in game view as well, and in standalone. I'll get a screengrab next time it happens, but it's really just a red rectangle when out of order, and a red rectangle with white "Submit" text inside it when in the correct order. \$\endgroup\$
    – A__
    Commented Dec 9, 2021 at 17:30
  • \$\begingroup\$ A long time ago I had a similar issue (not with unity), I managed to "fix" it by reducing the distance between the near and the far clipping planes of the camera. \$\endgroup\$
    – Vaillancourt
    Commented Dec 10, 2021 at 2:59


You must log in to answer this question.

Browse other questions tagged .