Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Gary Griswold

Rotate Sprite with children around center

Recommended Posts

I am trying to rotate a popup on a mobile device when the device rotates.  The popup is a sprite and it contains children text fields.  When I use rotation:"-=90" the sprite rotates, but the text disappears until I have rotated it 360.  However, rotationZ will rotate the text children with the sprite.  But with rotationZ I cannot find any way to redefine the registration point for the rotation to the center of the sprite.  TransformAroundCenter and TransformAroundPoint work will for rotation, but I can't seem to get them to work for rotationZ.

 

I am just starting to use Greensock.  I am part way through the Noble text, but I might be missing some things that are specific to the AS3 version of Greensock.

 

I attempted to upload a file, but it would not upload a file of type .as

Link to comment
Share on other sites

This is a common issue and is a limitation of Flash, not GSAP. Dynamic TextFields can't be rotated unless the font is embedded.

 

http://stackoverflow.com/questions/1117988/actionscript-how-do-i-rotate-a-text-field

 

 

The forum accepts .zip files, so you can zip your .as file first if you need to upload something.

Link to comment
Share on other sites

So, if I use flash.text.TextField, I must use embedded fonts.  But after some more experimentation, I have found two other solutions.

 

1) use rotationZ.  The following works, where 'this' is a sprite with a child flash.text.TextField

TweenLite.to(this, 1, {rotationZ:"-=90"});

 

The problem with this solution is that I cannot figure out how to transformOrigin in AS3.

 

2) use TextFlowLayout.  This works with rotation as follows:

var _point:Point = new Point(320, 460);
TweenMax.to(this, 1, {transformAroundPoint:{point:_point, rotation:"-=90"}});

 

A TextFlowLayout can be constructed as follows, but there are simpler ways to do this using text converters.

 

            var textFlow:TextFlow = new TextFlow();
            var para:ParagraphElement = new ParagraphElement();
            var span:SpanElement = new SpanElement();
            span.text = text;
            para.addChild(span);
            textFlow.addChild(para);
            
            var sprite:Sprite = new Sprite();
            sprite.x = _padding;
            sprite.y = _padding;
            var controller:ContainerController = new ContainerController(sprite, _allowedTextWidth, NaN);
            textFlow.flowComposer.addController(controller);
            textFlow.flowComposer.updateAllControllers();
            addChild(controller.container);
            
            _width = _padding * 2 + sprite.width;
            _height = _padding * 2 + sprite.height;

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.
×