MX Rotate Effect in Flex4
The Rotate effect rotates a component. You can set the starting and ending angle of rotation.
The Rotate effect rotates a component. You can set the starting and ending angle of rotation.MX Rotate Effect in Flex4:
The Rotate effect rotates a component. You can set the
starting and ending angle of rotation. You can use the following attribute for
set the angle.
1. angleFrom="0"
2. angleTo="360"
3. originX="0"
4. originY="0"
The tag of Rotate effect is <mx:Rotate>. In this example you can see how we can
use a Rotate effect with component.
Example:
|
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Declarations> <mx:Rotate id="imageRotate" angleFrom="0" angleTo="360" duration="2000" repeatCount="0" target="{globe}"/> <mx:Rotate id="manRotate" angleFrom="{angle-60}" angleTo="{angle}" target="{manglobe}"/> </fx:Declarations> <fx:Script> <![CDATA[ [Bindable] public var angle:int=0; public function Rotation():void { manRotate.end(); angle = angle + 60; manRotate.play(); } ]]> </fx:Script> <s:Panel title="MX Rotate Effect Example" width="487" height="285" chromeColor="#000000" color="#CCCCCC"> <mx:ApplicationControlBar width="485" horizontalAlign="center"> <s:Button label="Rotate Globe" click="imageRotate.play();" fontFamily="verdana"/> <s:Button label="Rotate man 60 Degree" click="Rotation();" fontFamily="verdana"/> <s:Button label="Stop" click="imageRotate.end();" fontFamily="verdana"/> </mx:ApplicationControlBar> <mx:Image id="globe" source="@Embed(source='file:/C:/work/bikrant/image/yellowglobe.png')" x="79" y="70"/> <mx:Image id="manglobe" source="@Embed(source='file:/C:/work/bikrant/image/man.png')" x="260" y="71"/> </s:Panel> </s:Application> |
Output:
Running Application:
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
