【Unity Shaders】使用Unity Render Textures实现画面特效——画面特效中的叠加（Overlay）混合模式

本系列主要參考《Unity Shaders and Effects Cookbook》一书（感谢原书作者）。同一时候会加上一点个人理解或拓展。

这里是本书全部的插图。

这里是本书所需的代码和资源（当然你也能够从官网下载）。

========================================== 切割线 ==========================================

写在前面

在这篇里，我们将会学习还有一种混合模式，叠加（Overlay）混合模式。这样的混合模式使用了条件推断语句来决定终于的像素值。

因此，这里用到的计算会略微复杂一点（事实上也非常easy啦）。

我们再复习一下叠加所用的计算公式：

，当中a是基色，b是混合色。

准备工作

1. 创建一个新的脚本。命名为Overlay_ImageEffect，以及一个新的Shader，名为Overlay_Effect。
2. 把上一篇中的C#代码拷贝到新的脚本中。
3. 把上一篇中的Shader代码拷贝到新的Shader中。

4. 把Overlay_ImageEffect脚本加入到Camera上。并使用Overlay_Effect Shader给脚本中的Cur Shader赋值。

实现

这篇的代码非常easy，大部分都不须要修改。修改的部分例如以下：

1. 之前说过，我们须要加入一个条件推断语句来进行颜色混合。为此。我们须要编写一个函数。它依次接受各个通道（RGB）的颜色值，然后再运行叠加操作。在frag函数上方定义例如以下函数：
   

   			fixed OverlayBlendMode(fixed basePixel, fixed blendPixel) {
   				if (basePixel < 0.5) {
   					return (2.0 * basePixel * blendPixel);
   				} else {
   					return (1.0 - 2.0 * (1.0 - basePixel) * (1.0 - blendPixel));
   				}
   			}

   
   
2. 最后，修改frag函数，来混合两张textures中的各个通道：
   

   			fixed4 frag(v2f_img i) : COLOR {
   				//Get the colors from the RenderTexture and the uv's
   				//from the v2f_img struct
   				fixed4 renderTex = tex2D(_MainTex, i.uv);
   				fixed4 blendTex = tex2D(_BlendTex, i.uv);
   				
   				fixed4 blendedImage = renderTex;
   				
   				blendedImage.r = OverlayBlendMode(renderTex.r, blendTex.r);
   				blendedImage.g = OverlayBlendMode(renderTex.g, blendTex.g);
   				blendedImage.b = OverlayBlendMode(renderTex.b, blendTex.b);
   
   				// Adjust amount of Blend Mode with a lerp
   				renderTex = lerp(renderTex, blendedImage,  _Opacity);
   				
   				return renderTex;
   			}

   
   

最后，你能够看到相似以下的效果：

叠加（Overlay）混合模式 Opacity = 1.0 ：

解释

叠加混合效果，实际上就是正片叠底（Multiply）和滤镜（Screen）两种混合模式的结合。

它通过推断每一个通道的颜色值，来决定使用哪种混合模式。

这篇是画面特效一章的最后一节了啦~如你所见，画面特效里面包括了非常多知识和内容。

它非常依赖你的平台和分配给画面特效的内存容量。

那么，尽可能愉快而富有创造力地和画面特效玩耍吧~