Flex-Just start-Image rotation

Flex 3, a simple application of image rotation.

1.Select a new Flex project from the New item in the File menu;

2.Use "JustStart" as the new Flex project name;

3.take a image from computer, rename it to myImage.jpg,

and drop it into the src folder of the new project;

4.add the code into the MXML file for the application;

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Image source="@Embed('myImage.jpg')" height="200" left="60" rotation="-10" top="60">
        <mx:filters>
            <mx:DropShadowFilter>
            </mx:DropShadowFilter>
        </mx:filters>
    </mx:Image>
</mx:Application>

5.Run the application.

 

comment:

source="@Embed('myImage.jpg')":load myImage.jpg

rotation="-10":the rotation angle

<mx:DropShadowFilter>:add the shadow for myImage.jpg

 

further:

4.add the new code into the MXML file

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:HBox top="10" left="10">
        <mx:HSlider minimum="-30" maximum="30" value="-10" toolTip="Rotation" change="myImage.rotation=event.currentTarget.value" liveDragging="true">
        </mx:HSlider>
        <mx:HSlider minimum="100" maximum="300" value="100" toolTip="Size" change="myImage.height=event.currentTarget.value" liveDragging="true">
        </mx:HSlider>
        <mx:CheckBox label="Visible" change="myImage.visible=event.currentTarget.selected" selected="true">
        </mx:CheckBox>
    </mx:HBox>
    <mx:Image id="myImage" source="@Embed('myImage.jpg')" height="200" left="60" rotation="-10" top="200">
        <mx:filters>
            <mx:DropShadowFilter>
            </mx:DropShadowFilter>
        </mx:filters>
    </mx:Image>
</mx:Application>

comment:

<mx:HBox>:add a Box

<mx:HSlider>:add two Sliders of Size and Rotation

<mx:CheckBox> :add a check box of Visible

chang="":the action

 

result: