【Unity3D Shader】学习笔记-位移动画
前言
Unity3D Shader学习笔记系列,由于是个人理解后写的,因此可能会出现描述错误,理解不到位的地方。另外没有完全从基础的知识开始,对于刚开始学习的同学还需要看更基础的知识进行补充。另本文图片源自网络,如有疑问请联系删除。
一、顶点动画
将顶点的坐标与三角函数进行算术运算,就可以得到一个在原始位置“左右上下”来回的动画效果。还可以通过定义一个_Direction方向向量来进行来回摆动方向。
v2f vert (appdata v) { v2f o; // 进行顶点位移操作 float4 pos = v.vertex; pos.x += sin(_Time.y); //pos.xyz += (1 + sin(_Time.y) * cos(_Time.x * 0.75)) * _Direction.xyz; o.vertex = UnityObjectToClipPos(pos); UNITY_TRANSFER_FOG(o,o.vertex); return o; }
例如:树草的随风摆动动画,通过左右摆动实现随风飘荡的效果,需要注意的特点是小草的摆动是越离根摆幅越小(通过y坐标达到这一点)。
v2f vert (appdata v) { v2f o; float4 pos = v.vertex; // 0.1 控制摆动幅度 // saturate(pos.y) 越离根越近越不摆动 pos.x += sin(_Time.y) * 0.1 * saturate(pos.y); o.vertex = UnityObjectToClipPos(pos); o.uv = TRANSFORM_TEX(v.uv, _MainTex); UNITY_TRANSFER_FOG(o,o.vertex); return o; }
二、UV动画
原理与顶点动画类似,对uv的xy分量进行加减乘除的操作来达到产生纹理动画效果,下面代码通过UV实现草的摆动效果。
fixed4 frag (v2f i) : SV_Target { float2 uv = i.uv; // uv默认没有负数,没有使用saturate uv.x += sin(_Time.y) * 0.1 * uv.y; fixed4 col = tex2D(_MainTex, uv); UNITY_APPLY_FOG(i.fogCoord, col); return col; }
另一个例子:绕中心旋转。主要是先将uv的中心从左下角移动到正中心,然后使用公式进行旋转uv后移动回左下角进行纹理采样。
fixed4 frag (v2f i) : SV_Target { float2 uv = i.uv - 0.5; //移动中心到贴图的中间 float t = _Time.y; // 旋转 half ux = uv.x * cos(t) - uv.y * sin(t); half uy = uv.x * sin(t) + uv.y * cos(t); uv.x = ux; uv.y = uy; // 重新移回去。-左下角。 fixed4 col = tex2D(_MainTex, uv + 0.5); UNITY_APPLY_FOG(i.fogCoord, col); return col; }
还有很多不同的效果会在接下来的文章中陆续分享,有兴趣的同学可以关注一波哟!