Rotate

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" verticalAlign="top"

    horizontalAlign="center" backgroundGradientColors="[#3B0B0B, #832323]" paddingTop="0" backgroundGradientAlphas="[1.0, 1.0]">

   

    <mx:Script>

        <![CDATA[

            [Bindable]

            public var angle:int=0;

            private function rotateImage():void {

                rotate.end();

                angle += 45;

                rotate.play();

            }

      ]]>

    </mx:Script>

   

    <mx:Rotate id="rotate" angleFrom="{angle-45}" angleTo="{angle}" target="{img}"/>

   

    <mx:Panel title="Rotate Effect" layout="absolute" color="0xffffff" borderAlpha="0.15" width="500"

         paddingTop="5" paddingRight="10" paddingBottom="5" paddingLeft="10" horizontalAlign="center" x="10" y="10">

        

         <mx:Text width="100%" color="0x323232" textAlign="center"

            text="Click the button to rotate the image 45 degrees. Use an embedded font when applying the Rotate effect to text." x="10" y="5"/>

        <mx:Image id="img" source="@Embed('images/helmet.jpg')"  x="180" y="41"/>

       

        <mx:ControlBar horizontalAlign="center" paddingTop="2" paddingBottom="2" x="0" y="198">

            <mx:Button label="Rotate 45 Degrees" click="rotateImage();"/>

        </mx:ControlBar>

       

    </mx:Panel>

   

</mx:Application>