Unity中实现灰度图效果

Posted 2022-04-18 御雪妃舞

曾经做游戏时研究过这个灰度图效果，一直没有时间把它写出来，最近空了，整理了出来。

本文将介绍两种灰度图效果，一种是普通Untiy中使用的材质的灰度图效果，一种是NGUI中使用在滚动轴中的灰度图效果.

一：普通Unity中使用的材质的灰度图效果

其实这就是一个简单的Shader处理，Shader脚本中的主要处理如图：

新建一个场景，里面建立一个Sphere然后给它新建一个材质，材质的Shader使用我们上面的Shader:

Fadellevel为1的时候效果如图：

FadelLevel为0时：

这样就实现了灰度效果，对于一般的情况都能使用，但是在NGUI中用不了，NGUI中的图集选涉及太多层级问题，还有它自己的Shader,那就需要改NGUI的Shader才能实现，现在我们就先不说这个问题，下面的链接这是这个Shader的下载地址：

下载此灰度效果的Shader

二：NGUI中实现灰度图效果

为啥会有这个需求呢，来讲下缘由，曾经做游戏中的技能面板时，某些技能在没有达到级别的时候是不能开放使用的，但是要显示出灰色的效果就能表示它是未激活的状态，但是这个技能条的所有图片都是来自NGUI的图集，如果我改了Shader,那么次图集中的所有图片就会变成灰色的，因为他们ShadreUV了。后来通过朋友告诉我怎么解决的呢，原来有个取巧的方法，替换NGUI中的所有Shader ,在颜色为特定值时，让它的效果至灰度图效果，楼主觉得想到这个方法的人这是太聪明了》

下面我说下具体的怎么弄的：

看下图：

在原有的Shader的基础上，做了灰度处理，就好了.

所以我们要这个效果的话，就把NGUI中的Resouces下有个Shaders文件夹，这里面是NGUI的Shader,然后我们把他们全都替换成我们改过的Shader就好，末尾我会上传这个包。

替换后，我新建一个NGUI的Texture,然后拖入图片如图所示：

     

然后理论上我吧图片的颜色改成0.19和0.21之间就能达到灰度效果，我们取0.2吧，对应成255的计算也就是51，然后我们把图片的ColorTint设置成（51,51,51,255）。

效果如图：真的变成灰色了哦。

最后附上替换Shader的包下载