Thursday, July 29, 2010

Flex Framework Button Demo


Flex Framework Button Demo with ActionScript

Aim:

            To Learn the Button and ActionScript.

Properties:

            Button have many properties:

            A). label- name of the button
            B). cornerRadius=”4”
            C). click- to call actionscript

Procedure:

Step 1:

            Create  Project FlexProject.

From previous post, we understand how to create project for flex framework.

Step 2:

            Create File

            I have used file name as ButtonDemo.mxml

            Include following coding into the ButtonDemo.mxml
           

< ?xml version = '1.0' encoding = 'ISO-8859-1'? >
< mx:Application xmlns:mx = 'http://www.adobe.com/2006/mxml' >
< mx:Script >
< ![CDATA[
private function display(event:Event):void
{
button.text="Hello";
}
]] >
< /mx:Script >
< mx:Panel title="Button Demo" height="500" width="500" layout="vertical" >
< mx:Label id="button" text="" color="#11EE22"/ >
< mx:Button label="Click"
color="Green"
cornerRadius="14"
click="display(event);"/ >
< /mx:Panel >
< /mx:Application >


Step 3:

          Made some changes in build.xml

          Already I have created build.xml

          So we made some changes in build.xml
……..
……..

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

………
………

Step 4:

Run the Application
























Step 5:

          Open the ButtonDemo.swf in Browser.

          You get output
























Click button the output

Hello


No comments:

Post a Comment