AE表达式实现传神弹性动画

此次分享的内容是很是重磅的！以致于我自己都不舍得拿出分享！虽然分享的是一位强大的老外（http://www.motions cript.com/articles/bounce-and-overshoot.html 是Adobe的保举博客）写出来的表达式，但还是有占为己有的心态，好吧，那末本次分享到此竣事~感谢旁观。

嘿嘿嘿，此次分享的是很是适用且高效的表达式！弹性表达式，Bounce 和 Overshoot！操纵这个两个表达式你可以垂手可得地实现各类弹性动画，如发抖、弹跳动画等。是的，你没听错，只要998个赞，你就能轻松获得随意加弹性Buff！赶紧拿起你的鼠标点赞吧！

表达式的推导进程可以点击检察上面的链接，原作者很是具体的论述了他的推导进程，大师快去跪拜吧！而且作者很是无私的贴出了两个（Bounce & Overshoot）可以间接停止关键帧的表达式，再次跪拜（室友问我为什么跪着打字）。前面我会提到怎样去快速了解和把握这个弹性两个表达式。

首先我们先来领会一下什么是Bounce 和 Overshoot吧！

Bounce

图表：

...........................

Overshoot:

图表：

我可以简单将：

       ·Bounce 了解为“反弹”，如 皮球落地反弹的结果；

       ·Overshoot（过冲、夸张的）了解为“发抖”，如 果冻发抖的结果。

说了这么多，我们来表达式的真容吧！原作者在他的文章末端贴出了可以间接停止关键帧的两个表达式，别离是（斜体部分）：

Keyframe 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);

}else

  value

...........................

Keyframe Bounce Back

e = .7;

g = 5000;

nMax = 9;

n = 0;

if (numKeys > 0){

  n = nearestKey(time).index;

  if (key(n).time > time) n--;

}

if (n > 0){

  t = time - key(n).time;

  v = -velocityAtTime(key(n).time - .001)*e;

  vl = length(v);

  if (value instanceof Array){

    vu = (vl > 0) ? normalize(v) : [0,0,0];

  }else{

    vu = (v < 0) ? -1 : 1;

  }

  tCur = 0;

  segDur = 2*vl/g;

  tNext = segDur;

  nb = 1; // number of bounces

  while (tNext < t && nb <= nMax){

    vl *= e;

    segDur *= e;

    tCur = tNext;

    tNext = segDur;

    nb

  }

  if(nb <= nMax){

    delta = t - tCur;

    value   vu*delta*(vl - g*delta/2);

  }else{

    value

  }

}else  value

...........................

其中应用了很大都学常识，归正我是看醉了。荣幸的是，要想利用它却不需要我们完全搞懂表达式的道理。

Ok，那末怎样利用它呢？

第一步，将上面两套表达式ctrl c复制到你的云笔记中，方便你的随时随地的挪用它（假如你可以复制到脑子里的话也行）。

看到这步，恭喜你！你已经学会了80%了。

...........................

下面我将拿 Keyframe OverShort 来举例。

该表达式的工作道理需要采样关键帧活动速度，你想要表达式一般工作，就要给最初一个关键帧一个速度值。也就是说发抖结果是由关键帧的速度值及表达式中的频次（freq）、衰减（decay）配合来控制的。简单的讲，利用了该表达式的某属性的最初一个关键帧的速度值将会很洪流平的影响表达式的发抖结果(好绕口啊)。所以当你感受发抖结果不明显时，也可以试试改变一下关键帧速度。（我第一次分享该表达式给其他同学时，很多人反应

没有结果，常常都是由于起关键感化的最初一个关键帧速度值为0而至使的）

以下图所示，OverShort表达式中的freq、decay连结稳定，改变最初一帧的速度，弹性结果随之改变（红圈暗示最初一帧的速度值）。

a：

...........................

b:

[温馨提醒]

1.点击“显现后表达式图表”，方便我们更好的感受弹性带震动（同时计较机的处置负荷会变大哦，所以看完记得随手关掉）。

2.该表达式可以用在一维、二维及三维属性（例如位置、扭转、缩放等等）。

...........................

不晓得到这里大师能否学会Bounce 和 Overshoot的用法。实在很简单，只是能够被我说复杂了。没关系，请看下面我糟糕的演示：

step 1：打好关键帧：

step 2：给关键帧加上活动曲线(由于录屏巨细的限制，看不到右键菜单，实在就是给关键帧加了一个缓动)：

step 3：让最初一个关键帧的速度值不为0（纵坐标暗示速度，我选中其中一个关键帧以后按了F9，让其缓动）：

step 4：将表达式复制到位置属性中并轻点小回车键：

step 5：预备好可乐和炸鸡，然后渐渐欣赏你的功效...

相信看到这里你应当已经学会了Bounce 和 Overshoot表达式的用法，能否是超简单，超适用！再次感激原作者（http://www.motions cript.com/articles/bounce-and-overshoot.html ）的无私分享！表达式实在能为我们省下很多贵重的时候，同时结果还不会打折反而更佳。表达式只是一门说话，当你把握充足多的“辞汇”，“语法”，“语句”你也可以尝试编写更适用的表达式，随时挪用。期待大师脑洞翻开！

贡献值排行榜：