使用Unity里的ShaderGraph实现物体边框呼吸灯效果_unity shader graph呼吸灯

提前声明一下，以下效果需要在hdrp项目中进行。

一、制作边框高亮

1. 创建物体

首先创建好我们的正方体：

用来接下来的边框显示。

2. 创建材质球

这里需要创建两个材质球，一个用于显示方块的材质，另一个用于边框的显示。

（Material用于方块材质，OutlineMat用于边框线）

为了更好地突出边框的视觉效果我这里给它加上了一个贴图，在Material里：

3. 创建着色器

在材质球同一目录下创建一个ShaderGraph：

（Create | Shader Graph | HDRP | Unlit Shader Graph)

4. 制作边框样式的着色器

首先我们需要两个变量作为输入：

        Scale 用于指定线框的缩放粗细；

        Color 用于指定线框颜色；

接下来进行编写：

这里将物体的位置与缩放 Scale 进行相乘得到缩放后的位置信息，之后再把color作为基础颜色挂载到Fragment上。

这里需要注意一下Color的模式需要时HDR：

再设置一下颜色：

然后需要剔除前方的渲染，只渲染后方：

做好后将Cube的材质设置成如图所示：

做好后的效果：

二、呼吸灯效果

1. 原理分析

呼吸灯呈现的效果是忽亮忽暗，变化程度随着时间均匀变换，所以这里需要时间作为输入增量，对时间求正弦即可以得到指定范围内的均匀变化：

即

呼吸灯的亮度变化是基于HDR颜色的Intensity属性，在实际的运算中Intensity属性是不存在的，这只是为了方便进行颜色设置的一层抽象。

所以如果想通过代码来设置 Intensity则需要下面的方式：

Color c;
 
c = Color(c.r * intensity_ratio, c.g * intensity_ratio, c.b * intensity_ratio);

（伪代码）

即颜色的rgb三个通道乘上强度比率。

HDR拾色器中强度+1，对应的intensity_ratio则是+0.1；

强度-1，则是intensity_ratio = -1；

建议的intensity范围是-1到1之间，对于呼吸灯一亮一暗的需求intensity_ratio只需要属于[0,1]区间即可

所以对于则需要进行量化操作，使其返回的值在[0,1]之间。

所以式子就会变成这样：

呼吸灯效果还需要有间隔时间以及亮度限制，为了使得呼吸灯效果功能更加完善，这里在ShaderGraph再引入三个变量：

Delay     : 呼吸间隔
HighLimit : 最亮限制
LowLimit  : 最暗限制

结合图像，delay则就是函数图像两个相邻的最低点横坐标值的差，则推导出：

（这个图像里delay默认是2）

然后就需要实现亮度限制，很显然，最大亮度限制就是函数图像的最大值，最小亮度限制同理。

所以呢，函数图像纵坐标的差值应该等于最大限制和最小限值的差：

然后再让它保持在纵坐标[0,1]之间，即在纵坐标向上移动最低限制值和函数图像高低点差值的一半，即：

这就是呼吸灯的基本原理了。

2. 改进Shader

打开最开始我们创建的Shader，添加三个变量：

随后在添加一个自定义函数节点：

最后再像这样连接起来：

最终效果：

（如果说做好后没有变化，记得查看一下Cube的Inspector视图下对于材质球着色器的参数设置）