HTML/CSS Service

Compiling MXML application

Category: Flex Components    |    2,389 views

In this tutorial you will be provided two ways to compile you flex source file. First one is very easy and in this you all have to just put or directly save your .mxml file in the bin directory of your flex folder. Here the bin directory is the place where the flex compiler is located.
Now open the command prompt switch to the flex bin directory and type mxmlc file-name.mxml. The output swf file will be generated in the same bin folder, where the flex compiler and your flex source file is located. Below i have described all these steps through the screen shots.

Here the name of my flex file is newbie.mxml.

Locating Flex newbie.mxml file
ow there is another way to do the above compiling job. This is done by apache’s ant technology, with which a build.xml file is created and is used to call the flex compiler and compile the flex .mxml file.
For beginners to Apache’s Ant and Flex, I’ve prepared an example of ant build.xml file as below -
You can download file in the end of this tutorila by clicking at the download link.
In this tutorial page you will be taught to deploy flex applications, along with this you will also get a brief introduction regarding flex components.
Here you just copy the code and save it with build.xml at place where you saved your .mxml file. In this case it is not necessary to save your file in flex bin directory, the place could be any other directory too.

build.xml




location = 'C:\flexsdk3.0.0.477\bin\mxmlc.exe'/>




Inside ‘ location’ attribute, relative path of Flex compiler is passed. From this path the ‘ant’ utility calls Flex compiler to compile the flex file. Flex file possess .mxml as its extension.
For calling the compiler code provided below is required.

'C:\Program Files\flexsdk3.0.0.477\bin\mxmlc.exe'/>
The table below shows that in your ant build.xml file you have to mention the file_name of your flex file that you want to compile. Here file name used is Tia.mxml.
Note :- A Flex developer has to update its flex file_name in the ant build.xml file every time with the new one with which the file has been saved.
Below table shows that the file .mxml when compiled into .swf is generated inside the ‘bin folder’ of our base directory. Base directory is the location where our build.xml and Tia.mxml file exist.



Below in the table is the code of Tia.mxml file shows an alert box whenever MOUSE_OVER event occurs.

Tia.mxml


initialize = 'createListener(event);'>


import mx.controls.Alert;

private function createListener(e:Event):void{
b1.addEventListener(
MouseEvent.MOUSE_OVER, myEventHandler);
b1.addEventListener(
MouseEvent.CLICK, myClickHandler);
}

private function myEventHandler(e:Event):void{
var result:Boolean = b1.dispatchEvent(
new MouseEvent(MouseEvent.CLICK,true,false));
}

private function myClickHandler(e:Event):void {
Alert.show(
“The event dispatched by the MOUSE_OVER was of type ‘”
+ e.type + “‘ .”);
}



Before running the ant file, the ant file build.xml and the flex file Tia.mxml should be placed in same location, here both have been saved in C:\baadshah directory. Now for compiling file Tia.mxml, open Command Prompt and type ant command as shown in image below.

BUILD SUCCESSFUL means our file Tia.mxml has been successfully compiled in to Tia.swf and is generated inside the bin folder. Now for running this Tia.swf file follow the steps as demonstrated below.

This should be your base directory:
Now open the bin folder.

Share/Save/Bookmark

1 Star2 Stars (+1)

Tags:

1 response so far!

Leave a Comment

*
To prove you're a person (not a spam script), type the security word shown in the picture. Click on the picture to hear an audio file of the word.
Click to hear an audio file of the anti-spam word