javascript - Tweenjs 用bounceOut 和return 缩放

Question

我需要在代码中创建一个补间动画，它可以放大并返回到原始大小并带有反弹效果。

createjs.Tween.get(this.movieClip).wait(200).to({scaleX:1.10,scaleY:1.10}, 1000, createjs.Ease.bounceOut);

据我所知，这会随着反弹效果扩大，但保持在 110%，我需要它在反弹效果内恢复到 100%。我可以使用带有反弹的补间动画来做到这一点......，但需要能够在代码中做到这一点。

Answer 1

您可以链接两个补间，也可以使用 Ease.backOut 在目标上方稍微补间，然后返回。

链接两个补间

createjs.Tween.get(circle, {loop: false})
  .to({scaleX: 1.2, scaleY:1.2}, 1000, createjs.Ease.getPowInOut(4))
  .to({scaleX: 1.0, scaleY:1.0}, 200, createjs.Ease.getPowInOut(2))

过冲然后向后移动

createjs.Tween.get(circle2, {loop: false})
  .to({scaleX: 1.0, scaleY:1.0}, 1000, createjs.Ease.getBackOut(3))

文档：https ://createjs.com/docs/tweenjs/classes/Ease.html