Jump to content
Search Community

[Solved] TransformAroundCenterPlugin bug?

Pilatus test
Moderator Tag

Recommended Posts

I am running a simple animation which animates an image to negative x coordinates outside the stage towards the left, so that the image disappears.

When I enable transformAroundCenter, the image would stop with its center point at x 0, so I see half of it on the left edge.

If I disable transformAroundCenter, then the animation completes properly.

 

Is this the wanted behaviour?  I would expect the animation to just work and move the object out of the way.

Link to comment
Share on other sites

Unfortunately it is very tough to diagnose your issue without seeing a reduced test case or the code you are using. 

 

Are you defining the x/y coordinates outside the transformAroundCenter object as advised in the docs?

 

Quote

[AS3/AS2 only] Normally, all transformations (scale, rotation, and position) are based on the DisplayObject's registration point (most often its upper left corner), but TransformAroundCenter allows you to make the 2D transformations occur around the DisplayObject's center. Keep in mind, though, that Flash doesn't factor in any masks when determining the DisplayObject's center.

 

If you define an x or y value in the transformAroundCenter object, it will correspond to the center which makes it easy to position (as opposed to having to figure out where the original registration point should tween to). If you prefer to define the x/y in relation to the original registration point, do so outside the transformAroundCenter object, like:

TweenLite.to(mc, 3, {x:50, y:40, transformAroundCenter:{scale:0.5, rotation:30}});

 

 

https://greensock.com/asdocs/com/greensock/plugins/TransformAroundCenterPlugin.html

 

Also Im pretty sure that scaling an object does not move the registration point. So chances are things are working properly and you will need to account for where the original registration point was prior to any transforms.

 

 

 

 

Link to comment
Share on other sites

Ok, my app is quite complex so I had to make an effort to extract and minimize to an example.

I posted also resulting video animations and yes I am not getting what I really want.

I want the object to move past the left edge and get out of the way, rotating around its own the center.

 

This is the code with x inside transformAroundCenter:

 

var o:flash.display.Sprite = new flash.display.Sprite();
o.graphics.beginFill(Color.RED, 1);
o.graphics.drawRect(400, 400, 100, 100);
o.graphics.endFill();
addChild(o);
TweenLite.to(o, 200, {useFrames: true, transformAroundCenter:{x: -400, rotation:360}});

 

this is the result animation:

https://tinyurl.com/ljcgdth

 

------------------------------------------------------------------------------------------------------------------------

 

This is the code with x outside transformAroundCenter:

 

var o:flash.display.Sprite = new flash.display.Sprite();
o.graphics.beginFill(Color.RED, 1);
o.graphics.drawRect(400, 400, 100, 100);
o.graphics.endFill();
Starling.current.nativeStage.addChild(o);
TweenLite.to(o, 200, {useFrames: true, x: -400, transformAroundCenter:{rotation:360}});

 

this is the result animation:

https://tinyurl.com/m69orgn

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.
×
×
  • Create New...