利用表达式制作文字弹性动画,还是比较的简单的,实用性也比较大,制作项目用的也是比较多的
开始之前,先看看我制作的效果GIF图:
(1)从上往下(字体开始位置在上方)
(2)从下往上(字体开始位置在下方)
(3)从左往右(字体开始位置在左方)
(4)从右往左(字体开始位置在右方)
制作教程
表达式如下:
delay = 0.05;
myDelay = delay*textIndex;
t = (time – inPoint) – myDelay;
if (t >= 0)
{ freq =3;
amplitude = 40;
decay = 12.0;
s = amplitude*Math.cos(freq*t*2*Math.PI)/Math.exp(decay*t);
[s,s] }
else
{ value }
表达式文字解释如下所示:
delay:间隔时间,freq:频率,amplitude:振幅,decay:衰减
PI就是圆周率π,PI是弧度制的π,也就是180°
所以,Math.PI = 3.14 = 180°.
Math.exp() 函数返回 ex,x 表示参数,e 是欧拉常数(Euler’s constant),自然对数的底数。
delay:间隔时间(注:字母之间出现的时间间隔,如表达式为delay=0.1,表示两个字母出现的时间间隔有0.1秒)
(3)改变表达式单一参数时,可以得到不同的效果。
①delay=0.3时,效果图如下:
②freq=10时,效果GIF图如下:
③amplitude = 200时,效果GIF图如下:
④decay =1.0时,效果GIF图如下:
以上就是今天的教程全部内容,如果有不懂的地方可以在评论区留言哦