写在前面,今天看了一下灰度处理的shader,发现其实不是很难。
原理
把原来图片颜色值做一个灰度处理,这句话说了好像啥都没说一样,就是用下面这个公式即可:
fixed gray= dot(col.rgb,fixed3(0.299,0.587,0.114));
但是为什么要这样写呢?为啥是点乘,在网上查了一些,都说这个是一个经验公式,就是多次试验而得。尴尬,然后我试着把这个几个数字修改成可控制的属性这样写:
fixed gray= dot(col.rgb,fixed3(_Power,_Power,_Power));
卧草,这样还可以调节的亮度,真是神奇至极,把_Power的值设成0到1。
但是我们还是不知道为啥要这样写?然后又看了一些资料,然后看到了一个叫YUV(百科)的东西,看了一下好像有点明白了,简单的理解就是:灰度图就是指只有亮度信息,没有色彩信息的图像,就像我们平时看到的黑白照片:亮度由暗明,变化是连续的。因此我们想表示灰度图,只用把这个亮度值得到即可。这里YUV一种电视信号颜色传递用的值,可以理解为另一个RGB的表示方式,而这里的Y就是我们想要得到的亮度值,这让我们得到Y就可以了。这个两个的转换公式也是有的,那问题不就是迎刃而解了吗?
那为什么我们写的自定义参数也可以达到灰度的效果呢?可能是我们这样得到的灰度图不是图片真正的亮度值,所以我们才可以调整灰度的亮度。
代码
代码时非常简单的,我们新建一个Unilt Shader,在属性中添加
_Power("Power",Range(0,1))=0.5//灰度的亮度
然后设置透明参数
Tags
{
"Queue"="Transparent"
"IgnoreProjector"="True"
"RenderType"="Transparent"
"PreviewType"="Plane"
"CanUseSpriteAtlas"="True"
}
Cull off
Lighting off
ZWrite off
Blend One OneMinusSrcAlpha
最后在片元函数中添加计算灰度公式即可
fixed4 frag (v2f i) : SV_Target
{
fixed4 col = tex2D(_MainTex, i.uv);
//计算灰度值
//也可以使用固定值来计算fixed3(0.299,0.587,0.114)
fixed gray= dot(col.rgb,fixed3(_Power,_Power,_Power));
col.rgb*=col.a;
return fixed4(gray,gray,gray,col.a);
}
最后就完成了,我还添加了一个颜色来控制灰度的透明度,其实没什么卵用,可以看完整代码。