createjs - 我想了解TweenJS的 "reversed"属性的使用

Question

我找不到任何有效的示例来理解 Tween Js 中“反向”属性的使用。你能给我发一些代码来解释这个问题吗？谢谢!!

Answer 1

“reversed”属性只是反向运行补间序列。所有位置都按照定义的相反顺序播放，甚至缓动也是反向应用的 (docs)。

例如，如果您创建一个将 x 位置从 0 变为 100 的动画，则将其从 100 变为 0 进行反向播放。如果您应用“quadOut”缓动，它将减慢接近尾声时会下降，但在倒放时会加快速度。

这是一个简单的例子，显示了两个相同的补间，但其中一个是相反的:https://jsfiddle.net/lannymcnie/98k0zvdx/

createjs.Tween.get(s, {loop:true})
    .to({x:300}, 3000, createjs.Ease.bounceOut);
createjs.Tween.get(s2, {loop:true, reversed:true}) // This one is reversed
    .to({x:300}, 3000, createjs.Ease.bounceOut);

希望对您有所帮助!