【Unity3D Shader】学习笔记-位移动画

简介: Unity3D Shader学习笔记系列,由于是个人理解后写的,因此可能会出现描述错误,理解不到位的地方。另外没有完全从基础的知识开始,对于刚开始学习的同学还需要看更基础的知识进行补充。一、顶点动画 将顶点的坐标与三角函数进行算术运算,就可以得到一个在原始位置“左右上下”来回的动画效果。还可以通过定义一个_Direction方向向量来进行来回摆动方向。

【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标达到这一点)。

                                                                                                                                 

                               微信图片_20220424145942.gif      


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动画


   原理与顶点动画类似,对uvxy分量进行加减乘除的操作来达到产生纹理动画效果,下面代码通过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后移动回左下角进行纹理采样。


微信图片_20220424145948.gif


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;
}


   还有很多不同的效果会在接下来的文章中陆续分享,有兴趣的同学可以关注一波哟!

相关文章
|
JSON atlas 图形学
unity之spine骨骼动画使用
unity实现spine骨骼动画使用
unity之spine骨骼动画使用
|
存储 缓存 图形学
ABC动画插件Alembic从浅入深(Unity3D)
今天分享一下Alembic插件的使用教程,这个插件的主要作用就是将.abc文件导入到Unity,然后进行播放。 .abc文件主要是影像业界使用的数据格式,用于存储巨大的顶点缓存数据。 Alembic插件就是转化这些影像资料和动力学等的模拟结果转换为顶点缓数 据为Unity可以使用的文件
|
缓存 安全 Linux
强大的动画插件——DOTween介绍(Unity3D)
DOTween是一个用于Unity的快速、高效、完全类型安全的面向对象动画引擎,为c#用户进行了优化,是免费和开源的,具有大量高级特性 DOTween兼容Unity 2019至4.6版本。 适用于:Win, Mac, Linux, Unity WebPlayer, WebGL, iOS, Android, Windows Phone, Windows Store, PS Vita (PSM), PS3/PS4, Xbox 360/One,任天堂Switch + more(没有测试额外的平台,但除了Flash导出,它应该可以在任何地方工作)
|
4月前
|
图形学 iOS开发
Unity——动效与缓动动画
Unity——动效与缓动动画
|
4月前
|
人工智能 算法 图形学
Unity 动画系统基本概念
Unity 动画系统基本概念
|
10月前
|
机器人 图形学 Ruby
【Ruby 2D】【unity learn】控制敌人随机运动以及动画控制
【Ruby 2D】【unity learn】控制敌人随机运动以及动画控制
|
10月前
|
定位技术 API 图形学
unity-2D游戏官方案例--带视频案例(1)(层级渲染,物理碰撞,粒子动画,UI等多位基础一体化)
unity-2D游戏官方案例--带视频案例(1)(层级渲染,物理碰撞,粒子动画,UI等多位基础一体化)
132 1
|
10月前
|
图形学
unity-初级动画系统
unity-初级动画系统
70 0
Unity-Timeline制作动画(快来制作属于你的动画吧)
Unity-Timeline制作动画(快来制作属于你的动画吧)
Unity-Timeline制作动画(快来制作属于你的动画吧)
|
iOS开发 MacOS Windows
Unity2D像素游戏开发——Aseprite简单人物绘画+动画制作导出精灵表示例
Unity2D像素游戏开发——Aseprite简单人物绘画+动画制作导出精灵表示例
528 0
Unity2D像素游戏开发——Aseprite简单人物绘画+动画制作导出精灵表示例