jeck猫
1、基础动画通过控制元素的基本属性来实现动效,位置(P)、缩放(S)、旋转(R)、透明度(T)例:列表元素由左向右滑动出现的动效2、路径动画路径动画就是物体或者某个元素按照设定好的路径进行运动例1: 纸飞机的运动例2: 针和线的运动例3: 水泡泡的运动例4: 卡片的滑动3、修剪路径动画通过在图层上添加路径,控制开始和结束的百分比来实现动画例1:加载完成例2、速度仪表盘进度条的动画例3、倒计时数字色条的转动4、融合动画两个物体靠近时有粘连效果5、跟随动画例1、儿子找父亲,儿子跟着父亲动6、弹性动画——表达式的运用A、Overshoot(过冲、夸张的)理解为“抖动”,如 果冻抖动的效果freq = 3;decay = 5;n = 0;if (numKeys > 0){n = nearestKey(time).index;if (key(n).time > time) n--;}if (n > 0){t = time - key(n).time;amp = velocityAtTime(key(n).time - .001);w = freq*Math.PI*2;value + amp*(Math.sin(t*w)/Math.exp(decay*t)/w);}elsevalueB、Bounce 理解为“反弹”,如 皮球落地反弹的效果elev = degreesToRadians(75);v = 1900;e = .7;f = .5;g = 5000;nMax = 9;tLaunch = 1;vy = v*Math.sin(elev);vx = v*Math.cos(elev);if (time >= tLaunch){t = time - tLaunch;tCur = 0;segDur = 2*vy/g;tNext = segDur;d = 0; // x distance travelednb = 0; // number of bounceswhile (tNext < t && nb <= nMax){d += vx*segDur;vy *= e;vx *= f;segDur *= e;tCur = tNext;tNext += segDur;nb++}if(nb <= nMax){delta = t - tCur;x = d + delta*vx;y = delta*(vy - g*delta/2);}else{x = d;y = 0;}value + [x,-y]}elsevalueC、弹性表达式,如拉橡皮筋