ShaderForge-序列帧动画

来源:互联网 发布:淘宝店铺推广流程 编辑:程序博客网 时间:2024/06/05 16:03

ShaderForge-序列帧动画

本系列开始进行ShaderForge实战案例分析,案例的参考来源自朧老师的ShaderForge教程。
附带教程链接地址:http://www.aboutcg.org/?s=shaderForge&post_type=course。
文末我会提供相关使用的素材。

效果预览

这里写图片描述

思路分析

首先我们肯定需要一张序列帧的图片,并且我们要根据序列图片的实际情况,来调整每一帧的播放位置,并且需要通过实践节点来控制自动播放效果,也可以添加其他变量来控制播放的速度。这个案例我们主要需要用到UVTile节点。

开始制作

创建默认的自定义光照模式Shader,并且删除默认的节点。
首先添加一个Texture2D节点,改名为MainTex,并且选择好图片素材,添加一个UVTile节点。
这里写图片描述
更改预览区域的默认模型,并且旋转预览区域的物体(刚开始可能是背面,看不到东西),连接节点进行预览。
我们先开看一下UVTIle节点,它有4个输入点。
这里写图片描述
UV:输入UV信息
Wid: U方向的放大倍数(比如2,U方向就平铺2次)
Hei:V方向的放大倍数(比如0.5,V方向就平铺0.5次)
Tile:控制显示的帧数

现在的图片情况我们应该UV分别放大4倍,并且尝试输入不同的Tile值。
这里写图片描述
通过观察我们发现,现在的播放顺序是从左下角开始播放,Unity默认的序列帧动画系统是从左上角开始播放。所以现在我们需要改变它的起始播放位置。
这里写图片描述这里写图片描述

现在我们将UV的V方向进行取反,
这里写图片描述
V方向取反之后,我们发现预览显示的起始位置正确了,但是图像反了,所以我们将原本的UV信息V方向进行重映射(1-0),然后与UV节点的U方向信息构造出一个新的UV信息。我们试着改变Frame的值,查看预览的效果。

现在效果正确了,但是我们需要让它自动进行播放。我们想到添加一个时间节点。
这里写图片描述

现在可以进行自动播放了,但是我们只是需要整数部分,不需要中间的小数过渡部分,我们对时间信息进行取整操作,如果想控制速度我们可以添加一个变量和乘法节点进行控制。

这里写图片描述
现在我们调节一个播放速度,调整到合适播放速度。
现在我们就实现了我们需要的效果,有时候如果左边预览区域不能实时更新,请手动点击一下编译。
完整的节点效果图。有些节点的命名可能没有说明,请大家自行根据意义进行定义。
这里写图片描述

相关素材

链接: https://pan.baidu.com/s/1bp33Gsv 密码: 5sw8

原创粉丝点击