Flex Framework TextBox Demo

Flex Framework TextInput

Aim:

            To learn the TextInput

Properties:

                        A). id-to get taxt box value

         B). displayAsPassword="false|true"

                      C).maxChars="0"

         D). length="0"

                      E). textHeight="0"

                            textWidth="0"

Procedure:

            Step 1:

                         Create Project

                         I have used the project name as FlexProject.

                        How to create project

                        Follow the following steps

                        1). Open Eclipse

                        2). Go File—New—Project

                        Window will open like below

The new window named New Project will open

Click next the another New Project window will open.

Click Next and Finish .

The project FlexProject will successfully created.

Step 2:

            Create mxml file

            I have used file name as TextInput

            Right click on FlexProject  -- New – File

New File Window will open. like below

                Where you give file name with extension TextInput.mxml.

                Note:

                                Don’t forget to put extension mxml with file name.

Click Finish . the file will successfully created.

Now you can see the TextInput.mxml on the left side window that is project explorer

]

You include following coding into TextInput.mxml

< ?xml version = '1.0' encoding = 'ISO-8859-1'? >
< mx:Application xmlns:mx = 'http://www.adobe.com/2006/mxml' >
< mx:Panel title="Text Demo" height="500" width="500" >
< mx:TextInput id="UserName"/ >
< /mx:Panel >
< /mx:Application >

Note:

< mx:Panle > … < / mx:Panle > is container to have all components.

Step 3:

            Already I have explained how to create build.xml

            You need only one build.xml for the project.

            There is no need to create more than one build.xml

The New File window will open.

Where you give file name as build.xml

And add following coding into the build.xml

< project name='Flex' default='mxml' >

< target name='mxml' >

< property name='compiler' location='E:\InstalledSoftware\FlexSoftware\bin\mxmlc.exe' / >

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

< echo > mxml file compiled successfully < /echo >
< echo > swf file generated successfully < /echo >
< /target >
< /project >





Note:

< property name='compiler' location='E:\InstalledSoftware\FlexSoftware\bin\mxmlc.exe' / >


You specify where the flex compiler is saved.

mxmlc.exe is flex compiler.


< arg line='-output F:\FLEXWORKSPACE\FlexProject\TextInput.swf' / >

you specify where you will save the TextInput.swf

< arg line='F:\FLEXWORKSPACE\FlexProject\ TextInput.mxml' / >
You specify where you have stored mxml file here TextInput.mxml file .


Remember if you want to create another mxml file. No need to create another build.xml

You made some changes in build.xml

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

Step 4:

          Run

          Open build.xml

Right click inside the  build.xml file and Run As – 1 Ant Build

And go to F:\FLEXWORKSPACE\FlexProject\TextInput.swf

And select TextInput.swf

You get ouput