Firstly I'm no expert with Flex so the following might be 101 gotchas.
My first problem is that I'm attempting to rotate a group of objects by 90 degrees that are contained within a canvas, each object is uniform in size containing text and an image. My first problem is that rotating the objects causes them to resize to the bounds of itself. For example if the object is 200 x 250 with an image stretching from 0 to 250 pixels, after rotation the contents would have resized to 200 pixels meaning the image is now 200 pixels. I can subsequently resize the object back up to the appropriate dimensions but feels awkward and clumsy. Is there a better way of performing this rotation where it rotates the object without the being restricted to the bounds of the object?
Secondly, I ideally need this code to run within the creationComplete event. When it does, the positioning / centering of the object is ignore and is different when rendered on the screen (for example, if I run the following code in my click event it rotates perfectly on its center point; through the creationComplete it offsets the object like the center point doesn't exist)?
Any pointers?
My rotation code...
<mx:Script>
<![CDATA[
// Capture the init for the application
private function InitialRotate( e:Event ):void{
var offsetWidth:Number = (this.width / 2);
var offsetHeight:Number = this.y + (this.height / 2);
// Rotates on the center (but resizes)
var tempMatrix:Matrix = this.transform.matrix;
tempMatrix.translate(-offsetWidth,-offsetHeight);
tempMatrix.rotate(90 * (Math.PI / 180));
tempMatrix.translate(+offsetWidth,+offsetHeight);
this.transform.matrix = tempMatrix;
// Adjusts the objects position and width to size appropriately
this.y -= 5.5;
this.width = 256;
}
]]>
</mx:Script>