Author Topic: Is there a grayscale shader for use with NGUI?  (Read 17504 times)

Disastercake

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 1
  • Posts: 87
  • www.disastercake.com
    • View Profile
    • Disastercake
Is there a grayscale shader for use with NGUI?
« on: January 09, 2015, 08:34:15 PM »
I'd like to show my icons as grayscale when they are disabled or cannot be used for some reason (like no energy).  Is there a grayscale shader in the NGUI framework?  I looked around but couldn't find one.  If there isn't, what could be changed the existing shader to make it show grayscale instead of color and still work with the scrollviews and other widgets from GUI?
Creator of Soul Saga.
http://www.disastercake.com

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Is there a grayscale shader for use with NGUI?
« Reply #1 on: January 10, 2015, 12:50:07 PM »
No there isn't. NGUI sprites are drawn using an atlas which references a specific material. You can't specify a different material without changing the material, which means changing the atlas as well.

Disastercake

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 1
  • Posts: 87
  • www.disastercake.com
    • View Profile
    • Disastercake
Re: Is there a grayscale shader for use with NGUI?
« Reply #2 on: January 13, 2015, 10:22:12 PM »
Thanks for the response Aren.  Is there a way to have 2 atlases that use different materials (one normal one grayscale) and the texture used for both materials is the same?
Creator of Soul Saga.
http://www.disastercake.com

FrankYan

  • Newbie
  • *
  • Thank You
  • -Given: 6
  • -Receive: 2
  • Posts: 18
    • View Profile
Re: Is there a grayscale shader for use with NGUI?
« Reply #3 on: January 13, 2015, 11:33:58 PM »
May be you can use two atlas.Normal one and the grayscale one(just use same material).In your project ,you can dynamic change sprite's atlas.
The grayscale atlas you can use this shader for help file:///C:/Users/Administrator/Desktop/GrayShader.shader

FrankYan

  • Newbie
  • *
  • Thank You
  • -Given: 6
  • -Receive: 2
  • Posts: 18
    • View Profile
Re: Is there a grayscale shader for use with NGUI?
« Reply #4 on: January 13, 2015, 11:34:42 PM »
  1. Shader "Custom/GrayShader" {
  2. Properties
  3.         {
  4.                 _MainTex ("Base (RGB), Alpha (A)", 2D) = "black" {}
  5.         }
  6.        
  7.         SubShader
  8.         {
  9.                 LOD 100
  10.  
  11.                 Tags
  12.                 {
  13.                         "Queue" = "Transparent"
  14.                         "IgnoreProjector" = "True"
  15.                         "RenderType" = "Transparent"
  16.                 }
  17.                
  18.                 Cull Off
  19.                 Lighting Off
  20.                 ZWrite Off
  21.                 Fog { Mode Off }
  22.                 Offset -1, -1
  23.                 Blend SrcAlpha OneMinusSrcAlpha
  24.  
  25.                 Pass
  26.                 {
  27.                         CGPROGRAM
  28.                                 #pragma vertex vert
  29.                                 #pragma fragment frag
  30.                                
  31.                                 #include "UnityCG.cginc"
  32.        
  33.                                 struct appdata_t
  34.                                 {
  35.                                         float4 vertex : POSITION;
  36.                                         float2 texcoord : TEXCOORD0;
  37.                                         fixed4 color : COLOR;
  38.                                 };
  39.        
  40.                                 struct v2f
  41.                                 {
  42.                                         float4 vertex : SV_POSITION;
  43.                                         half2 texcoord : TEXCOORD0;
  44.                                         fixed4 color : COLOR;
  45.                                 };
  46.        
  47.                                 sampler2D _MainTex;
  48.                                 float4 _MainTex_ST;
  49.                                
  50.                                 v2f vert (appdata_t v)
  51.                                 {
  52.                                         v2f o;
  53.                                         o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
  54.                                         o.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);
  55.                                         o.color = v.color;
  56.                                         return o;
  57.                                 }
  58.                                
  59.                                 fixed4 frag (v2f i) : COLOR
  60.                                 {
  61.                                         fixed4 col;  
  62.                                         col = tex2D(_MainTex, i.texcoord);  
  63.                                         float grey = dot(col.rgb, float3(0.299, 0.587, 0.114));  
  64.                                         col.rgb = float3(grey, grey, grey);  
  65.                                         return col;
  66.                                 }
  67.                         ENDCG
  68.                 }
  69.         }
  70.  
  71.         SubShader
  72.         {
  73.                 LOD 100
  74.  
  75.                 Tags
  76.                 {
  77.                         "Queue" = "Transparent"
  78.                         "IgnoreProjector" = "True"
  79.                         "RenderType" = "Transparent"
  80.                 }
  81.                
  82.                 Pass
  83.                 {
  84.                         Cull Off
  85.                         Lighting Off
  86.                         ZWrite Off
  87.                         Fog { Mode Off }
  88.                         Offset -1, -1
  89.                         ColorMask RGB
  90.                         AlphaTest Greater .01
  91.                         Blend SrcAlpha OneMinusSrcAlpha
  92.                         ColorMaterial AmbientAndDiffuse
  93.                        
  94.                         SetTexture [_MainTex]
  95.                         {
  96.                                 Combine Texture * Primary
  97.                         }
  98.                 }
  99.         }
  100. }
  101.  
  102.  

huevoquilmes

  • Newbie
  • *
  • Thank You
  • -Given: 2
  • -Receive: 0
  • Posts: 10
    • View Profile
Re: Is there a grayscale shader for use with NGUI?
« Reply #5 on: September 23, 2015, 12:57:52 PM »
Hi guys, I'm using the gray shader above, but it doesn't work on scroll views. Any idea why this might be? I tried using normals in the scroll view but had no luck.
Thanks!

huevoquilmes

  • Newbie
  • *
  • Thank You
  • -Given: 2
  • -Receive: 0
  • Posts: 10
    • View Profile
Re: Is there a grayscale shader for use with NGUI?
« Reply #6 on: September 23, 2015, 01:52:49 PM »

After looking around in the forum I realized that it lacks clipping, so here is a modified version that has clipping based on the Transparent Colored 1 NGUI shader.
Hope it helps!

  1. Shader "Hidden/Unlit/Transparent Gray 1"
  2. {
  3.    Properties
  4.    {
  5.       _MainTex ("Base (RGB), Alpha (A)", 2D) = "black" {}
  6.    }
  7.  
  8.  
  9.    SubShader
  10.    {
  11.       LOD 200
  12.  
  13.  
  14.       Tags
  15.       {
  16.          "Queue" = "Transparent"
  17.          "IgnoreProjector" = "True"
  18.          "RenderType" = "Transparent"
  19.       }
  20.      
  21.       Pass
  22.       {
  23.          Cull Off
  24.          Lighting Off
  25.          ZWrite Off
  26.          Offset -1, -1
  27.          Fog { Mode Off }
  28.          ColorMask RGB
  29.          Blend SrcAlpha OneMinusSrcAlpha
  30.  
  31.  
  32.          CGPROGRAM
  33.          #pragma vertex vert
  34.          #pragma fragment frag
  35.  
  36.  
  37.          #include "UnityCG.cginc"
  38.  
  39.  
  40.          sampler2D _MainTex;
  41.          float4 _ClipRange0 = float4(0.0, 0.0, 1.0, 1.0);
  42.          float2 _ClipArgs0 = float2(1000.0, 1000.0);
  43.  
  44.  
  45.          struct appdata_t
  46.          {
  47.             float4 vertex : POSITION;
  48.             half4 color : COLOR;
  49.             float2 texcoord : TEXCOORD0;
  50.          };
  51.  
  52.  
  53.          struct v2f
  54.          {
  55.             float4 vertex : POSITION;
  56.             half4 color : COLOR;
  57.             float2 texcoord : TEXCOORD0;
  58.             float2 worldPos : TEXCOORD1;
  59.          };
  60.  
  61.  
  62.          v2f o;
  63.  
  64.  
  65.          v2f vert (appdata_t v)
  66.          {
  67.             o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
  68.             o.color = v.color;
  69.             o.texcoord = v.texcoord;
  70.             o.worldPos = v.vertex.xy * _ClipRange0.zw + _ClipRange0.xy;
  71.             return o;
  72.          }
  73.  
  74.  
  75.          half4 frag (v2f IN) : COLOR
  76.          {
  77.             // Softness factor
  78.             float2 factor = (float2(1.0, 1.0) - abs(IN.worldPos)) * _ClipArgs0;
  79.          
  80.             // Sample the texture
  81.             half4 col = tex2D(_MainTex, IN.texcoord) * IN.color;
  82.              float grey = dot(col.rgb, float3(0.299, 0.587, 0.114));  
  83.             col.rgb = float3(grey, grey, grey);
  84.             col.a *= clamp( min(factor.x, factor.y), 0.0, 1.0);
  85.             return col;
  86.          }
  87.          ENDCG
  88.       }
  89.    }
  90.    
  91.    SubShader
  92.    {
  93.       LOD 100
  94.  
  95.  
  96.       Tags
  97.       {
  98.          "Queue" = "Transparent"
  99.          "IgnoreProjector" = "True"
  100.          "RenderType" = "Transparent"
  101.       }
  102.      
  103.       Pass
  104.       {
  105.          Cull Off
  106.          Lighting Off
  107.          ZWrite Off
  108.          Fog { Mode Off }
  109.          ColorMask RGB
  110.          Blend SrcAlpha OneMinusSrcAlpha
  111.          ColorMaterial AmbientAndDiffuse
  112.          
  113.          SetTexture [_MainTex]
  114.          {
  115.             Combine Texture * Primary
  116.          }
  117.       }
  118.    }
  119. }
  120.