Sprite动画效果实现

2D游戏中通过短时间内快速切换贴图来实现动画效果。为了减少贴图数量,可以合并为一张贴图,根据时间来修改UV坐标,达到和切换贴图一样的效果。
在UnityShader的Properties块中,定义属性:

Properties {
    _MainTex ("Base (RGB)", 2D) = "white" {}
    _CellAmount ("Cell Amount", float) = 0.0
    _Speed ("Speed", float) = 12
}

这里定义了合并后的贴图、子贴图数量和切换动画的速度。
在CG代码中可以这么写:

float spriteUV = IN.uv_MainTex;    //得到UV坐标

float cellUVPercentage = 1.0 / _CellAmount;  //每个单元格占有的百分比

float timeVal = fmod(_Time.y * _Speed, _cellAmount);    //按照时间获取当前需要展示的单元格
timeVal = ceil(timeVal);    //向上取整,得到单元格的下标

float xValue = spriteUV.x;
xValue += timeVal;
xValue *= cellUVPercentage;    //修正UV,加上offset
spriteUV = float2(xValue, spriteUV.y);

这里没有修改UV的y分量,如果我们合并的贴图是按grid方式排列,那么是需要对y也做类似操作。
代码部分的主要难点是如何做修正。先求出每一cell所占的百分比cellUVPercentage,如8张贴图并排合并成一张贴图,那么cellUVPercentage=1.0/8=0.125。
第一个cell的区间:0 - 0.125
第二个cell的区间:0.125 - 0.25
......
第八个cell的区间:0.875 - 1.0
所以按照时间分别取得0,1,2,3,...,7,0,1,2,3,....。

posted @ 2018-09-19 15:03  dreamnwx1  阅读(1296)  评论(0编辑  收藏  举报