本文是《【手把手带你Godot游戏开发 第二弹】名场面临摹》的一部分。老王将手把手教大家如何使用Godot引擎的Shader，实现一个游戏中常见的旗帜飘飘的效果。
Godot Engine 3.2.1stable
Blender 2.82a
效果图
步骤
建模
建一个三角形
增加细分
退回到物体模式再做一个旗杆和底座
将旗杆底座与旗帜合并成一个物体，进入UV工作间。
进入编辑模式选择旗帜部分，切换到一个垂直于旗帜平面的视角，按U选择从视角投影，这样展开的旗帜是没有变形的
把旗杆和底座分别缩成小点，放到左边
导出UV布局图
导出的布局图如下
导出glTF格式模型，注意这回我们不用导出材质。
制作贴图
在任意图像处理软件中，参照UV布局图，做如下的图片：
基础色贴图：base_color
隐藏UV布局层，导出后如下：
位移遮罩：offset_mask
这个图分为两个区域：左侧全黑区域 右侧由黑到白的渐变区域
越黑代表位移越小，越白代表位移越大，旗杆、旗杆座以及旗帜的最根部应该都是不动的。这也是为什么旗帜的根部一定要放到纯黑色区域一部分。
隐藏UV布局层，导出后如下：
导入引擎
将下面三个文件直接导入Godot引擎
着色器
这段着色器代码的原理还是很简单的，可以通过各个参数微调旗帜随风飘扬的效果，利用了一个正弦函数制造出波动的效果。
shader_type spatial;render_mode cull_disabled;//两面都要渲染，所以要将禁用剔除模式uniform sampler2D base_color;//基础色贴图uniform sampler2D offset_mask;//遮罩贴图uniform float speed = 0.1;//UV移动速度uniform float amplitude = 10.0;//振幅uniform float frequency = 0.01;//频率void vertex(){vec2 uv = UV - speed*vec2(1.0,0.0)*TIME;float mask = texture(offset_mask,UV).z;float wave = sin(TIME*uv.x*frequency);VERTEX.z += mask*wave*amplitude;}void fragment(){vec4 color = texture(base_color,UV);ALBEDO = color.rgb;}
为旗帜模型添加一个ShaderMaterial然后加上上面的着色器代码。在Shader Param处将两张贴图分别赋值到相应的位置。
