javascript - 基于当前位置创建补间位置

Question

我正在使用create.js的tween.js。我正在尝试制作一个弹跳动画，比给定的动画更复杂。更具体地说，我试图通过偏移量而不是给定的坐标来补间对象的 y 。似乎有一种简单的方法可以做到这一点，例如:

createjs.Tween.get(circle, {loop:false}).to({offset-x: 100}, 1000, createjs.Ease.linea);

最终问题:如何根据对象的当前位置补间对象的坐标？

Answer 1

当您创建 Tween 实例时，您正在创建确定性动画，这意味着您可以将补间的位置设置为任何值(0 到 1 之间)，并且它将位于您期望的位置。

如果我明白你在问什么，你想预先制作一个补间，但让它使用对象的当前位置而不是制作补间时的值。如果是这种情况，那么您将需要采用不同的方法。也许您应该在需要时按需生成补间，而不是一开始就生成。这样，它就可以使用您当前的位置。

这是一个快速示例:http://jsfiddle.net/x4xxwjuv/ 球以恒定的速度移动，但是当您单击按钮时，它会:

1. 根据当前位置稍微向后调整
2. 或补间到特定 Y 位置(落到地板上)

然后它恢复正常移动。补间球已填充，动画球未填充。

这是来自尖峰的示例代码。

createjs.Tween.get(ball)
    .to({x: ball.x+(ball.xSpeed*-4), y:ball.y+(ball.ySpeed*-4)}, 1000, createjs.Ease.bounceOut);