unity中UI界面的一些动画实现总结

在做unity的ui界面的时候，美术通常会实现一些动画效果。这里列举几个：
1、位置的变化
2、旋转的变化
3、缩放的变化
4、alpha的变化
5、颜色的变化

我们举一个例子：

位置的变化：
（1）target为作用的对象；
（2）curve为曲线变化
（3）duration
（4）startdelay为延迟几秒之后做动画
（5）type为动画类型
（6）loop为循环模式
（7）from是开始的位置，to为结束的位置；
我们这里重点讲解下曲线的使用，是如何采样，并做插值的。

from为起始位置，to为终止位置；通过当前的时间，除以duration做一个线性插值。
curPosition = from*(1-percent)+to*percent; //当percent=0的时候curPostion=from；当percent=1的时候curPostion=to；
这是最常见的插值方式。

这里的percent的计算，是一个当前的时间，作为x坐标，然后从曲线上采样出的y的值。
曲线样子比如为：

可以发现，x轴为0到1，y轴也为0到1。
我们首先看x轴对应于我们程序中的什么，在动画开始的时候，将累加的时间countdown=0，
每帧countdown+=deltaTime;
x = countdown * 1.0f / duration; //这里的duration为动画的持续时间
我们这里要对x做限制，映射到[0~1]的范围内。这样通过函数：

AnimationCurve curve;
percent = curve.Evaluate(float time);

就可以采样出来曲线的y的值了，然后用y的值，作为插值系数，进行插值。
有人说，是不是可以直接用x作为插值系数呢？可以的，但是这样就是严格的线性插值了。我们可以将曲线提供给美术，让美术去更改插值的系数，这样更灵活。
UI动画的大体的思路如此。虽然只有这么几种动画模式，但是加了动画之后，ui就可以有很多意想不到的效果。

下面有一个具体的应用：
比如比赛视频里的成绩榜，就经常出现下面的效果：
https://www.bilibili.com/video/BV1Ys411u7oq/?spm_id_from=autoNext

这个在unity的滑动列表中怎么做呢，我们就可以通过上面的组件，对每个item，进行逐个的做动画，以实现。
实现思路：
1、在每个item上加动画组件
2、在update的主循环中逐个进行做动画
3、还未轮到做动画的item，将其初始化为最初始化的状态即可。