Wednesday, August 11, 2010

Flex Framework Checkbox with ActionScript

Flex Framework CheckBox with ActionScript


Aim:

A check box is a box on a web page that can be checked by a user. Unlike a radio button, more than one box can be checked at once.

Form this post; we can understand which checkbox will be selected using actionscript.

Procedure:

Step 1:

Open Eclipse IDE

Step 2:

Crete Project already we have created project named as FlexPro

Step 3:

Create file CheckboxScript.mxml

Include following coding into the CheckboxScript.mxml


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

< mx:Application xmlns:mx = 'http://www.adobe.com/2006/mxml' >
< mx:Script >
< ![CDATA[
private function display(event:Event):void
{
if(Reading.selected)
{
dis.text="You select Reading Books";
}
if(!Reading.selected)
{
dis.text="You Are Not Select Reading ";
}
if(Playing.selected)
{
dis1.text="You Select Playing Cricket ";
}
if(Watching.selected)
{
dis2.text="You select watchng tv";
}
}

]] >
< /mx:Script >
< mx:Panel title="CheckBox With ActionScript" height="500" width="500" >
< mx:Label id="dis" text="" / >
< mx:Label id="dis1" text="" / >

< mx:Label id="dis2" text="" / >

< mx:CheckBox id="Reading" label="Reading books"/ >

< mx:Button label="OK" click="display(event);"/ >
< /mx:Panel >
< /mx:Application >

Explain:

We create three checkbox and button.

We select checkbox and click OK button.

The control goes to actionscript and call display function. Because in button, we use click=”display(event)”.

We use if control statement, to decide which checkbox is selected.

Step 4:

Already we have build.xml. so no need to create build.xml. you just include the following coding into the build.xml

……
……
< exec executable='${compiler}' failonerror='true' >
< arg line='-output F:\FLEXWORKSPACE\FlexPro\CheckboxScript.swf' / >
< arg line='F:\FLEXWORKSPACE\FlexPro\CheckboxScript.mxml' / >
< /exec >

……
……

Step 5:

Run the application

Step 6:

You get output like below















You select Playing Cricket and click OK button.


The message will be displayed in Label 2

No comments:

Post a Comment