Unity 之 ShaderGraph 实现小旗随风飘扬效果入门级教程
前言
若你的工程还没有进行基础配置,请查看我的博文Unity 之 ShaderGraph入门使用详解,按照步骤操作完成配置即可,还能顺便学习一下基础操作流程哦~
本文手把手教你制作模拟小旗随风飘扬效果入门级教程,还不快动手试试?有经验的童鞋可以直接跳到最后一步,按照图示搭建即可。
一,效果展示
老规矩,直接上效果图:
没学习Shader Graph之前:我靠😱 !这效果有点牛啊,那个大佬写的?
学习了Shader Graph之后:我去😒 !就这?岂不是有手就行?
二,原理介绍
-
通过
Posinton
节点使Y轴前后移动,注意需要节点上的的Space
调整为Object
: -
然后通过
Sine
节点,其前后移动变成波浪形成,进而模拟随风飘的效果:
-
最后通过拆分
UV
节点,使得小旗的左边不动,达到绑定在旗杆上的效果:
三,制作步骤
-
准备工作
在Project面板右键 --> Create --> Shader --> PBRGraph(我这里命名为“RedFlagPBRGraph”),然后双击打开编辑器面板:
-
通过Posinton节点保证X,Z轴顶点不变
通过上面的原理介绍可以知道,最终效果只需要修改模型顶点的Y轴位置,所以这里我们使用Split
拆分节点对Posinton
节点进行拆分,并将拆分后的结果的X,Z值,分别赋值给Vector 3
节点,并将Vector 3
节点输出连接到主节点的Vertex Position
上:(PS:将需要Posinton
节点的Space
调整为Object
)
-
通过Posinton控制Y轴的前后移动
再次创建Posinton
和Split
节点,将需要Posinton
节点的Space
调整为Object
,并连接如下:
然后我们创建一个通常使用的自动时间控制节点,创建Time
时间节点,Vector 1
节点并将其设置为公开属性,创建Multiply
乘法节点,将其连接起来:
-
使用Sine节点模拟飘动
创建Add
加法节点,将3步骤中的两个节点连接起来,然后创建Sine
节点,将Add
节点的输出和Sine
节点的输入连接起来:
这时将Sine
节点输出连接到2步骤中,留的Y轴输入,即可在预览图中看到一个漂浮的效果:
在”Main Preview“面板右键,选择”Custom Mesh“,然后选择”Plane“,此时预览结果就是小旗飘飘的样子的:
-
通过UV节点控制其绕杆扇形移动
由4步骤中的预览图我们可以看到整个模型都在上下浮动,这与现实中的旗子🚩 是不一样的,我们需要将其左边固定,让其越往右浮动效果越明显。
创建UV
节点,创建Split
拆分节点对UV进行拆分,然后将拆分后的值,和4步骤中的Sine
节点使用Multiply
乘法节点连接起来,再赋值给2步骤中预览的Y轴输入:
-
添加贴图节点显示旗帜
至此小旗飘飘的效果已经制作完成了,下面为小旗添加一个贴图:创建Sample Texture 2D
节点作为贴图输入和Texture 2D Asset
节点作为公开属性(选中节点右键选择“Convert To Property”),然后将其连接起来即可:
最后记得点击右上角的"Save Asset"保存一下,至此小旗飘飘的Shader就制作完成了。【文末完整图示】
四,使用示例
-
创建材质球并使用刚制作的Shader
这里提供一个快捷创建材质球的方法,鼠标选中我们保存的“RedFlagPBRGraph”文件,然后右键创建材质球,这样我们创建出来的材质球,就自动使用这个Shader了。
-
在“Hierarchy”面板创建Plane,并将刚刚创建的材质球赋值给它,得到结果如下:
-
为材质球的公开属性赋值,调试效果:(为了展示效果我运行之后录的)
五,完整图示
小旗飘飘ShaderGraph面板完整图示:
- 点赞
- 收藏
- 关注作者
评论(0)