原文链接

[译] 实现Unity 后处理特效 (3) _渐变 Ramp | Qinfei

유니티 포스트 프로세싱 이펙트 만들기 (3) - Ramp

原文写得很好，但是主题格式我不太喜欢，所以我对文章的格式进行了修整，方便自己日后阅读

正文

最近沉迷做后处理效果，无法自拔~真的太有趣了，我基本上一天能做一个，哈哈哈。

今天想跟大家分享的效果，应用范围非常广，而且很有趣呀。

基于该系列第一篇文章的内容，我们先创建 RampImageEffect.shader 和 RampImageEffect.cs 两个文件。如果大家眼尖的话，看文件命名就能马上猜到“哇！是不是要放ramp纹理？” “Bingo!" 其实在做角色的时候，我们经常会把 halfLambert 放入 UV 中，但今天我会把它放入后处理里面。

什么是 Ramp 纹理呢？

把模型的明暗梯度当成 uv，采样横向长的纹理（Ramp 纹理，其实横纵的数据都可用，但今天我暂且只用横向数据...）。看上去好像是纹理一一对应包裹了模型，这个技术叫 Diffuse Warp，这里使用的纹理是 Ramp texture。

这个技术可用于卡通渲染，fake BRDF，特效等等...应用范围非常广，我先来做一个基本形。

在 shader 中，添加两个属性 _RampAmount 和 _RampTexture 来控制 _Ramp 的强度。

按之前的方法，在脚本中生成 RampImageEffect ，并连接 OnRenderImage 。重复写几次代码之后，码代码的速度也越来越快，也越来越熟练了...（译者：笑 hhhh）

现在重新回到 shader 里，写一下处理核心计算的 frag 函数。

因为在后处理过程中，我们用 ndotl 求 halfLambert，不能放 Ramp 纹理，所以我把在第 1 篇文章中做的 luminance 拿过来，把它当做 uv 的 x 坐标来用。如果使用 _RampAmount 插值的话，就可在源图像和 Ramp 图像之间插值。

组件如上图所示，我临时做了一张 ramp 纹理，导入。

Ramp texture 放大后的效果如上。

此外，如果我们换一张 ramp 纹理的话，可得到不同的效果。对比效果如下。

每张图像都的风格都不一样。可是假如我想要不同的效果，就需要去 Photoshop 中一次次反复修改和确认 ramp 纹理，想想就觉得很麻烦。

所以啊，如果可以边看效果边改画面的颜色和明暗值，岂不是美滋滋，对吧？:)))

嗯，以下就是我今天要分享的 核心内容 啦，如何动态生成、使用 Ramp 纹理！

如上图所示，蓝色框是注释，红色框是我添加的代码。

为了替换之前的 ramp 纹理，我想用新的动态纹理来设置 shader 的 _RampTex，所以我注释掉了一些代码。因为明暗和色调是分开实现的，所以 AnimationCurve 类型的 rampCurve 处理明暗，Gradient 类型的 rampColor 处理色调，把它们都放进 dynamicTex 里面。

酱紫，就能添加曲线和颜色渐变了。接下来的内容 非常关键 ！在 Update 函数中添加生成纹理的逻辑。

由于这个功能 只用在编辑器 中执行，所以用 #if UNITY_EDITOR 封装比较好。如果没有封装的话，build 好运行时，这个计算会一直执行，很耗性能。在没有 dynamicTex 的时候，我们生成一张水平为 256，垂直为 1 的临时纹理（压缩选 无压缩）。然后创建一个数组来储存颜色，并命名为 ColorBuffer。为了获取我们刚做好的纹理的全部像素，我用了 GetPixels 函数，所以 Color 的数组计数就是 256 。

现在，让这些数组执行 for 语句，就可以从 rampColor 和 rampCurve 中得到各个通道值。如果把 0~1 范围的值作为因子(x 坐标)放入 Evaluate 的话，就能返回至对应的结果值。