0

我有一个矢量圆圈，该怎么做：

我想用 tweenlite 对其进行动画处理，使其看起来像爆炸的冲击波。起初它淡入（从 0 到 0.5）并被缩放，当它达到总动画时间的一半时它会淡出但它仍然会被缩放（希望你明白我的意思）。

目前它看起来很糟糕，因为我不知道如何使用 TweenLite 从第 1 部分平滑过渡到第 2 部分。我的动画在第 1 部分结束时停止，并突然跳转到第 2 部分。

有人可以帮我解决这个问题吗？非常感谢你。：）

动画总时间：0.75 秒总缩放量：5

part 1 of 2:

TweenLite.to(blastwave, .375, {alpha:.5, transformAroundCenter:{scale:2.23},
            onComplete:blastScaleFadeOut, onCompleteParams:[blastwave]});


part 2 of 2:

private function blastScaleFadeOut(object:DisplayObject, time:Number = .375, scaleVal:Number = 4.46) {

TweenLite.to(object, time, {alpha:0, transformAroundCenter:{scale:scaleVal},
    onComplete:backgroundSprite.removeChild, onCompleteParams:[object]});

}
4

2 回答 2

1

TweenLite对补间过渡应用缓动函数来控制变化率，默认缓动是 Quad.EaseOut（这意味着补间中的变化率将在接近结束时使用二次函数减速）。这就是为什么您会看到如此突然的变化（或“跳跃”），因为在两个补间（或您所说的部分）的“连接点”处，变化的速度是完全不同的：第一个补间在它的最慢的速度是因为它即将结束，而另一个速度最快的是因为它才刚刚开始。

恐怕要真正确保不会出现“跳跃”（第 1 部分结尾和第 2 部分开头的速率相同）的唯一方法是使用Linear.easeNone缓动，这意味着没有缓动或加速（在补间期间保持恒定速度）：

TweenLite.to(blastwave, .375, 
{ease:Linear.easeNone, alpha:.5, transformAroundCenter:{scale:2.23},
onComplete:blastScaleFadeOut, onCompleteParams:[blastwave]});

//part 2 (put inside function)
TweenLite.to(object, time, {ease:Linear.easeNone, alpha:0, transformAroundCenter:{scale:scaleVal},
onComplete:backgroundSprite.removeChild, onCompleteParams:[object]});

但我建议您尝试使用缓动函数及其参数，并尝试找到适合您需求的组合（Linear.easeNone 有点无聊）。

希望这可以帮助！

于 2011-10-27T08:47:12.443 回答
1

您应该重新考虑如何管理这些补间。您应该将精灵的缩放比例设置为一个补间，然后将 alpha 转换分成两个单独的补间。默认情况下，这在 TweenLite 中不起作用，因为它是 Tween 覆盖策略。但是，您可以通过使用TimelineLite链接补间或overwrite:OverwriteManager.NONE向补间添加属性来更改此设置。这两种解决方案有效：

使用 TimelineLite 链接您的补间：

var timeline:TimelineLite = new TimelineLite();
timeline.insert(TweenLite.to(blastwave, 0.7, {scaleX: 7, scaleY: 7}));
timeline.insert(TweenLite.to(blastwave, 0.35, {alpha: 0.5}));
timeline.insert(TweenLite.to(blastwave, 0.35, {alpha: 0, delay: 0.35}));

或者只是更改补间覆盖策略：

TweenLite.to(s, 0.75, {scaleX: 7, scaleY: 7, overwrite:OverwriteManager.NONE});
TweenLite.to(s, 0.35, {alpha: 1, overwrite:OverwriteManager.NONE});
TweenLite.to(s, 0.35, {alpha: 0, delay: 0.35, overwrite:OverwriteManager.NONE});

关于 TweenLite 的 OverwriteManager 和补间覆盖。

附带说明一下，如果您将爆炸缩放为 0.7 秒，则将整个 alpha 输入、alpha 输出过程缩短，例如 0.55 秒。那样看起来更好。:]

于 2011-10-30T09:06:29.947 回答