Jump to content
GreenSock

LynnB

Trying to stop TranformAroundCenter tween

Recommended Posts

How do I stop the transformAroundCenter from repeating on CLICK after the initial click and tween?

In the file attached clicking the button twice causes the transformAroundCenter to repeat which I don't want. The other element such as scale don't repeat only the transformAroundCenter element does.

 

Is it something so obvious that I'm missing?

 

Thanks!

Link to comment
Share on other sites

It's not a bug - it's just has to do with the way Flash reports rotation values (it always reports them as between 180 and -180). So when you tween rotation to a value of 360, it works, but if you check the rotation after the tween is done, it will report as being 0, not 360. They're essentially the same thing anyway. The same thing would happen if you tweened to 720. Anyway, when you click, TweenLite sees that you want to tween from whatever value "rotation" is currently at (0) to the value of 360. So it spins around. See what I mean?

 

I noticed a few other problems in your code:

 

1) You put alpha and autoAlpha INSIDE the transformAroundCenter object. Don't do that - only transform properties like scaleX, scaleY, width, height, and rotation should go in there. Put alpha and autoAlpha outside that object (but still in the vars object).

 

2) Why are you using a TimelineLite if there's only one tween in it? It's not "wrong" per se, but it's just a bit wasteful and it makes your code longer. I'd just do a regular tween (no need to put it into a TimelineLite). If you're sequencing a bunch of tweens, then it's a good idea. Or if you need to control a group of tweens as a whole.

 

So to get around the rotation issue, I'd recommend using a Boolean variable that tracks the state, like this:

 

var isOpen:Boolean;
function clickHandler(event:MouseEvent):void {  
if (!isOpen) {
	TweenLite.to(box, .75, {transformAroundCenter:{scaleX:2.5, scaleY:2.5, rotation:360}, autoAlpha:1, ease:Sine.easeOut});
}
isOpen = true;
}

function boxclose(event:MouseEvent):void {
if (isOpen) {
	TweenLite.to(box, .75, {transformAroundCenter:{scaleX:0, scaleY:0, rotation:360}, autoAlpha:0, ease:Sine.easeOut});
}
isOpen = false;
}

Link to comment
Share on other sites

Thank you Jack! That makes sense.

I will remove the alpha's and put them where they belong.

The reason there's only 1 tween in the Timeline was just for demonstration purposes only for this file so you could just see the issue I was having with the transformAroundCenter.

 

Thank you again!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×