Shader Graph UI Image Shader does not work

[Lexone]

Can confirm that jessmwoodward’s solution of deleting these two passes from the generated shader code works.

I tested this on Unity 2021.3.21f1 LTS

Pass
{
    Name "SceneSelectionPass"

    ........................

    #include "Packages/com.unity.render-pipelines.universal/Editor/ShaderGraph/Includes/SelectionPickingPass.hlsl"

    ENDHLSL
}

Pass
{

    Name "ScenePickingPass"

    ........................

    #include "Packages/com.unity.render-pipelines.universal/Editor/ShaderGraph/Includes/SelectionPickingPass.hlsl"

    ENDHLSL
}

[adritake]

I just run into the same problem and I digged into the frame debugger where all the passes that your guys mentioned where showing up and screwing up the sprite:

I don’t want to update the generated shader code each time I change the shader graph so I suppose I’ll go with an old school hand written shader. This is the base shader I am using (I’ll include all the effects I need here):

Shader "Unlit/UIActionButton_shader"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" { }
    }
    SubShader
    {
        Tags { "RenderType" = "Transparent" "Queue" = "Transparent" }
        LOD 100
        Blend SrcAlpha OneMinusSrcAlpha

        Pass
        {
            CGPROGRAM
            #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;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;

            v2f vert(appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                return o;
            }

            fixed4 frag(v2f i) : SV_Target
            {
                fixed4 col = tex2D(_MainTex, i.uv);
                return col * col.a;
            }
            ENDCG
        }
    }
}

[sonolil]

Is this still not fixed? I keep getting alerts for this thing.

Actually I’ve been using a seperate overlay camera for my ui ever since. I found that it’s much better to manage than having a humongous overlay canvas hanging around your scene. But I also understand the comments that don’t want to switch to that workflow.

Even so… won’t Unity fix this? This still seems very basic and I’m still getting alerts and complaints. Like I said, I don’t think copying the default shader and editing to fix it is a very scalable solution. I’m unfollowing this thread but please be aware of this issue, the staff who are responsible.

[jessmwoodward]

I ran into another quirk with this today, so thought I’d link here in case it’s relevant to anyone else.

In short, on Android devices my custom UI shader was disappearing whenever an OnApplicationFocus(false) event occurred. Had to weed out a few more chunks of shader code to stop it from happening:

UI Custom Shader disappears on Android when the application is sent on background

Apologies for bumping an old thread, but I was having the same issue and thought I’d share my workaround for anyone else who’s googling. (I’m using Unity 2021.3.3f1) In my case, my custom Shadergraph-made UI shaders were disappearing whenever OnApplicationFocus(false) event occurred - eg when the keyboard was opened, or the mediapicker was opened. Using the generated shader code, I went through and I deleted out any sections that seemed more relevant to 3D surfaces. To be safe, I saved & check…

I’m with sonolil - I would love it if Unity either made Sprite Unlit compatible with UI again, or made an official UI Shadergraph version. Surely UI shaders would be a pretty popular use for Shadergraph.

[bebo77]

For me the texture works fine rather, does anyone know how to access the color parameter from Shadergraph?

I tried with _MainColor and _Color but it doesn’t work.

[Qriva]

@bebo77

I tried with _MainColor and _Color but it doesn’t work.

Try vertex color

[bebo77]

@Qriva

Try vertex color

Thank you so much!!!

[Seromu]

UI Integration with Shader Graph - Unity Platform - Rendering & Visual Effects | Product Roadmap (productboard.com)

Finally!!!

Beginning in 2023.2 beta 16, you can now select Canvas as a new Material Type in the Graph Inspector for HDRP, URP, and Built-In. This new Material Type creates shaders that are compatible with UGUI Canvas elements, such as Image. Using Shader Graph for UGUI Canvas elements allows users to create an infinite array of animated effects and tune the behavior and appearance of the UI while also reducing performance and memory costs.

Unity 2023.2.0a18

• Shadergraph: Enabled Shader Graph Canvas Master Node to allow users to create UI shaders for Canvas in HDRP, URP, and Built-in.

[LiamAttClarke]

I think I ran into the same issue some here have reported.

My custom Sprite Unlit ShaderGraph was rendering transparency correctly in the scene view.

Scene View:

But in game view, transparency seemed to revert to some serialized solid colour (in my case red):

Even though I was using the “Sprite Unlit” Material in my ShaderGraph, it seems the serialized “Alpha Clipping” property of the “Unlit” Material was causing the failure.

I managed to get this working by doing the following:

1. Switch your ShaderGraph to use “Material: Unlit” in the Graph Inspector.
2. Activate “Alpha Clipping”
3. Switch back to using “Material: Sprite Unlit”
4. Save Asset

Check out this recording I made of the issue:

Unity ShaderGraph Issue Demonstration

[FredMoreau]

Hi @LiamAttClarke ,

thanks for providing detailed feedback and taking the time to record a video.
Let me ask which version of Unity, URP and Shader Graph are you using?
As I just tested in 2023.2.0a17 and it seems to work just fine.

Also, have you reported it as a bug?

Thanks!

[MHDante]

Liam’s video posted above was using 2021.3.19f1. with URP/SG @ 12.1.10

Bug was not reported elsewhere.

[C-Through]

In case others stumble across this thread, I’m using 2023.2.0a22, and there’s now a Canvas Shadergraph template. Anddd, it works!

[Magnesium]

Hello,

That’s great and all but it’s probably going to take at least another year for 2023 to reach LTS…

[peng_can]

with 2022.3.8 I set to sprite lit , blend mode is alpha and also checked “Alpha Clipping” not seen this problem.

[Mad_is_Debugging]

@SunnyValleyStudio

I think that transparency will start working with a Sprite Unlit shader if you set the Canvas component to Render Mode Screen Space - Camera and assign the MainCamera as the Render Camrera.

I hope it helps!

It worked. You saved my day thank you.

[DmitryDerybas]

Unity 2022.3.42f1
For me, my sprites have a dark red background in the editor, but in the build everything is ok

[bmtminecraft]

THANK YOU SO MUCH FOR THE CAMERA INFO!!!
I tries lituerly EVERYTHING to make my shadergraph work, and while scene view was displaying correctly, game view just didnt work properly, this fixed it.
Tysm!!