问在AS3中使用GreenSock补间精灵大小
EN

Stack Overflow用户

提问于 2013-03-14 17:25:15

回答 2查看 860关注 0票数 1

我见过使用scaleX对矩形进行补间的例子，但我找不到任何对圆进行补间的东西。(我画的“圆”实际上是一个圆环形状，我希望外面的圆是补间的那个)。

var resizeVar:Number = 75;

myCircle.graphics.drawCircle((myCircle.width/2), (myCircle.height/2), resizeVar);
myCircle.graphics.drawCircle((myCircle.width/2), (myCircle.height/2), 75);

我试过这样做，但是抛出了很多错误。我不认为这样做是可能的：

TweenMax.to(myCircle, 2, {resizeVar:150, ease:SlowMo.ease.config(1, 0)});

通常，对于显示对象，它是这样完成的。不过，它不适用于这个“甜甜圈”：

TweenMax.to(myRectangle, 2, {scaleX:1.5, scaleY:1.5 ease:SlowMo.ease.config(1, 0)});

所以我的问题是，我如何在外圆的半径大小之间进行补间？

编辑:这是甜甜圈的绘制方式，因此resizeVar需要从75更改为150。

var myCircle:Sprite = new Sprite();

myCircle.graphics.beginFill(0xbbbbbb);
myCircle.graphics.drawCircle(0, 0, 150); // this is what should be tweening/scaling
myCircle.graphics.drawCircle(0, 0, 75); // this should stay the same
myCircle.graphics.endFill();

addChild(myCircle);

actionscript-3

flash

animation

tween

gsap

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-03-14 17:50:05

您应该能够在任何displayObject的scaleX和scaleY属性之间进行补间：

var radius:Number = 75;
var myCircle:Sprite = new Sprite();
myCircle.graphics.beginFill(0);
myCircle.graphics.drawCircle(radius/2, radius/2, radius);
myCircle.graphics.endFill();
addChild(myCircle);

TweenMax.to(myCircle, 2, {scaleX:2, scaleY:2, ease:SlowMo.ease.config(1,0)});

编辑

这就是如何缩放甜甜圈的外部：

var resizeObject:Object = { innerRadius:75, outerRadius:150 };
myCircle = new Sprite();
myCircle.graphics.beginFill(0xbbbbbb);
myCircle.graphics.drawCircle(0, 0, resizeObject.outerRadius);
myCircle.graphics.drawCircle(0, 0, resizeObject.innerRadius);
myCircle.graphics.endFill();

addChild(myCircle);    
TweenMax.to(resizeObject, 2, {outerRadius:300, ease:SlowMo.ease.config(1,0), onUpdate:updateCircle, onUpdateParams:[resizeObject]});


function updateCircle(resizeObject:Object):void 
{
    myCircle.graphics.clear();
    myCircle.graphics.beginFill(0xbbbbbb);
    myCircle.graphics.drawCircle(0, 0, resizeObject.outerRadius);
    myCircle.graphics.drawCircle(0, 0, resizeObject.innerRadius);
    myCircle.graphics.endFill();
}

票数 2

Stack Overflow用户

发布于 2013-03-14 17:47:26

它适用于矩形的原因是您正在更改矩形的比例。更改缩放比例时，Flash Player会调整包含图形的显示对象的缩放比例。

但是，对于圆，您正在尝试更改圆的半径。仅当使用drawCircle()方法绘制圆时才使用半径。补间半径的一种方法是使用补间多次重新绘制圆(不是很理想)。

要使用新半径重新绘制圆，可以使用TweenMax提供的onUpdate回调：

TweenMax.to(myCircle, 2, {resizeVar:150, onUpdate: onUpdateCallback, onUpdateParams: [resizeVar] });

function onUpdateCallback(radius):void
{
    myCircle.graphics.drawCircle(myCircle.graphics.drawCircle((myCircle.width/2), (myCircle.height/2), radius);
}