createjs基于当前位置的补间位置

时间:2016-08-09 01:40:09

标签: javascript jquery html createjs tween

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

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

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

1 个答案:

答案 0 :(得分:1)

创建Tween实例时,您正在创建一个确定性动画,这意味着您可以将补间的位置设置为任意值(介于0和1之间),它将位于您期望的位置。

如果我理解你的要求,你想要预先补间,但让它使用对象的当前位置而不是补间时的值。如果是这种情况,那么您将需要一种不同的方法。也许您应该在需要时按需生成补间,而不是最初。这样,它可以使用您当前的位置。

以下是一个快速示例:http://jsfiddle.net/x4xxwjuv/ 球以恒定速率移动,但当您单击按钮时,它将:

  1. Tween根据当前位置稍微退一步
  2. 或Tween到特定的Y位置(掉到地上)
  3. 然后它恢复正常移动。补充的球被填充,动画的球没有。

    以下是秒杀的示例代码。

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