【Unity3D】水面特效
1 前言
水波特效 中通过屏幕后处理实现了环形水波效果,本文通过 Shader Graph 实现了模拟水面特效,包含以下特效细节。Shader Graph 基础知识详见→Shader Graph简介、Shader Graph节点、程序纹理简单应用。
- 深水区和浅水区颜色差异;
- 水面有波纹,并且在移动;
- 水面起伏波动;
- 水面边缘有水泡;
- 水中物体因折射而扭动。
本文完整资源详见→Unity3D水面特效。

2 水面特效实现
由于本文需要使用 Scene Color 节点的颜色缓冲区信息模拟水面折射现象,而 Scene Color 节点只能在 URP 或 HDRP 管线下才能正常工作(详见→Shader Graph节点),因此本文选择在 URP 管线下实现模拟水面特效。
2.1 场景搭建及环境配置
1)场景搭建
在 URP 项目中搭建场景如下。

说明:水面模型是一个长方形,并且网格不能太稀疏,否则对顶点的上下波动将不太自然。
2)配置 Universal Render Pipeline Asset
由于实验中使用了 Scene Depth 和 Scene Color 节点获取深度缓冲区和颜色缓冲区信息,需要在 Universal Render Pipeline Asset 中勾选 Depth Texture 和 Opaque Texture,如下。

3)主图配置
由于水面是透明的,需要在主图的 Graph Settings 中将 Surface Type 属性设置 Transparent,并且取消勾选 Cast Shadows(投射阴影)和 Receive Shadows(接受阴影)如下。

2.2 水面 Shader Graph
1)主图
Water.shadergraph

WaterDepth、FinalWaterColor、WaterNormal、WaterPosition 都是自定义节点,释义如下,Smoothness 用于调整水面光滑度。
- WaterDepth 节点:水面到水底的深度计算;
- FinalWaterColor 节点:水面最终的颜色(混合深浅水颜色、泡沫颜色、背景折射颜色);
- WaterNormal 节点:水面法线;
- WaterPosition 节点:水面坐标。
2)WaterDepth 子图
WaterDepth.shadersubgraph

说明:WaterDepth 子图用于计算水面深度;Scene Depth 节点用于获取不透明物体的深度值(水底深度),Screen Position 节点输出的 w 分量是水面的深度,两者相减就是水面到水底的深度值。SubtractDepth、DepthStrength 释义如下。
- SubtractDepth:深度减去的参数,其值越大浅水区越大;
- DepthStrength:深度加强的参数,其值越大浅水区越小。

如果将 Water Depth 子图的输出直接连到主图片元着色器的 Base Color 上,显示效果如下。从图中可以看到,Water Depth 节点能够较好得识别物体的边缘。

3)FinalWaterColor 子图
FinalWaterColor.shadersubgraph

说明:FinalWarterColor 子图用于计算水面最终的颜色(混合深浅水颜色、泡沫颜色、背景折射颜色),WaterColor 节点用于计算水面颜色(混合深浅水颜色、泡沫颜色),WaterRefraction 节点用于计算背景折射颜色。
4)WaterColor 子图
WaterColor.shadersubgraph

说明:WaterColor 子图用于计算水面颜色(混合深浅水颜色、泡沫颜色),BubbleColor 节点用于计算泡沫颜色,ShallowColor、DeepColor、WaterDepth 的释义如下。
- ShallowColor:浅水区的颜色;
- DeepColor:深水区的颜色;
- WaterDepth:水面到水底的深度,用于混合深水区和浅水区的颜色。
5)BubbleColor 子图
BubbleColor.shadersubgraph

说明:BubbleColor 子图用于计算泡沫颜色,BubbleSpeed、BubbleDensity、BubbleFilter1、BubbleFilter2、BubbleBrightness、WaterDepth 的释义如下。
- BubbleSpeed:水泡移动的速度;
- BubbleDensity:水泡的密度,其值越大水泡越小且越密集;
- BubbleFilter1:水泡过滤参数,其值越大,水泡越稀疏;
- BubbleFilter2:水泡过滤参数,其值越大,水泡越稀疏;
- BubbleBrightness:水泡亮度;
- WaterDepth:水面到水底的深度,用于过滤气泡,只有浅水区才有气泡。
6)WaterNormal 子图
WaterNormal.shadersubgraph

说明:WaterNormal 子图用于计算水面法线,NormalStrength、WaterDepth 的释义如下。
- NormalStrength:法线最大强度;
- WaterDepth:水面到水底的深度,用于调整法线强度,深水区波纹较深,浅水区波纹较浅。
7)WaterPosition 子图
WaterPosition.shadersubgraph

说明:WaterPosition 子图用于模拟水面起伏效果,通过调整顶点坐标的 y 分量实现,WaveHeight 用于调整水面起伏的最大高度。由于 WaterPosition 子图的输出连在顶点着色器上,而 WaterDepth 是在片元着色器中计算的,因此不能使用 WaterDepth 对 WaveHeight 进行混合(即深水区水面起伏大,浅水区水面起伏小)。
8)WaterRefraction 子图
WaterRefraction.shadersubgraph

说明:WaterRefraction 子图用于计算背景折射颜色,通过对颜色缓冲区的纹理进行随机偏移采样实现,折射的 Shader 实现详见→反射和折射。RefractionStrength 用于调整折射偏移强度,Screen Position 节点用于获取屏幕顶点的 uv 坐标,Scene Color 节点(类似于 Shader 中的 GrabPass)用于获取颜色缓冲区纹理(仅在 URP 或 HDRP 管线下才能正常工作),节点详见→Shader Graph节点。
2.3 运行效果

声明:本文转自【Unity3D】水面特效。