昨天群里有网友问在UGUI上如何让图片变灰，其实这个需求我们项目以后也会有，所以趁有空就捣鼓了一下。

UGUI的image组件上有材质球插槽，那么很显然可以从这里入手，然后编写shader，挂载上去效果就出来了。

原图：

http://s8/mw690/002wvREMgy6RcYPUsv567&690

灰色效果：

http://s2/mw690/002wvREMgy6RcYQsGul61&690

Blending的渲染顺序：

http://s2/mw690/002wvREMgy6Rd06GM1zf1&690

新建一个shader，增加融合和变灰的代码即可。

通过这样的一个小例子，可以发现UGUI比NGUI在处理UI界面时，更容易通过shader去做一些效果。

shader代码：

1. Shader "UI/Default Grey"     
2. {     
3.     Properties     
4.     {     
5.         [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}     
6.         _Color ("Tint", Color) = (1,1,1,1)  
7.     }     
8.      
9.     SubShader     
10.     {     
11.         Tags     
12.         {      
13.             "Queue"="Transparent"      
14.             "IgnoreProjector"="True"      
15.             "RenderType"="Transparent"      
16.             "PreviewType"="Plane"     
17.             "CanUseSpriteAtlas"="True"     
18.         }     
19.         // 源rgba*源a + 背景rgba*(1-源A值)   
20.         Blend SrcAlpha OneMinusSrcAlpha  
21.      
22.         Pass     
23.         {     
24.             CGPROGRAM     
25.             #pragma vertex vert     
26.             #pragma fragment frag     
27.             #include "UnityCG.cginc"     
28.                  
29.             struct appdata_t     
30.             {     
31.                 float4 vertex   : POSITION;     
32.                 float4 color    : COLOR;     
33.                 float2 texcoord : TEXCOORD0;     
34.             };     
35.      
36.             struct v2f     
37.             {     
38.                 float4 vertex   : SV_POSITION;     
39.                 fixed4 color    : COLOR;     
40.                 half2 texcoord  : TEXCOORD0;     
41.             };     
42.                
43.             sampler2D _MainTex;       
44.             fixed4 _Color;     
45.      
46.             v2f vert(appdata_t IN)     
47.             {     
48.                 v2f OUT;     
49.                 OUT.vertex = mul(UNITY_MATRIX_MVP, IN.vertex);     
50.                 OUT.texcoord = IN.texcoord;     
51. #ifdef UNITY_HALF_TEXEL_OFFSET     
52.                 OUT.vertex.xy -= (_ScreenParams.zw-1.0);     
53. #endif     
54.                 OUT.color = IN.color * _Color;     
55.                 return OUT;  
56.             }  
57.      
58.             fixed4 frag(v2f IN) : SV_Target     
59.             {     
60.                 half4 color = tex2D(_MainTex, IN.texcoord) * IN.color;     
61.                 float grey = dot(color.rgb, fixed3(0.22, 0.707, 0.071));   
62.                 return half4(grey,grey,grey,color.a);     
63.             }     
64.             ENDCG     
65.         }     
66.     }     
67. }
68.  

刚才秒杀了这个需求，要是去年的这个时候就没法秒杀。

临时来了一个感悟吧，学习离不开所在的圈子，离不开大神们的指引。

吃水不忘挖井人，感谢大大们。