在TweenJS中循环后暂停

Question

我希望你们中的一些人使用过tween.js（create.js libs套件的一部分）。

我有一个JS小提琴向你展示我的问题：http://jsfiddle.net/qyp8Y/1/

我看到每个8步循环后暂停，不应该在那里。

有人可以看看它并告诉我我做错了吗？

谢谢！

Answer 1

当然，让我们介绍一些代码：

for (i = 0; i <= 8; i++) {
    t.to({
        rotation: 45 * i
    }, 1000, Ease.elasticOut).wait(200);
}

以下是您在该循环中创建的值：

i : rotation 
0 : 0
1 : 45
2 : 90
3 : 135
4 : 180
5 : 225
6 : 270
7 : 315
8 : 360

请注意，出于您的目的，0和360的值相同。这意味着当循环从头开始时，它从360到0（或无处）补间整整一秒。

您的对象从旋转0开始，您无法将补间删除到360.但是，您可以通过从补间开始到45（从1开始）将冗余补间移除到0/360

这种改变导致了这一点（注意：我也改变了方便性，所以我可以更好地看到它）：

for (i = 1; i <= 8; i++) {
    t.to({
        rotation: 45 * i
    }, 1000, Ease.quadInOut).wait(200);
}

当然，要解决的下一个问题是如何使齿轮旋转但不会像它那样失去正确的光照/阴影方向。我会留给你的。

更新：我通过你提交的github问题找到了这个。