| Register
Friday, May 09, 2008   

How does MXML do it in ActionScript?

Created By  Satori Canton, at  6/11/2007 - 0 comments.

Click to view this author's website.

An interesting fact about the way the Flash 9 compiler works, is that it takes all of your MXML and converts it to ActionScript before going ahead and compiling the entire SWF from nothing but ActionScript code.

Wouldn't it be interesting to see exactly what all the ActionScript is that is generated automatically just to compile a simple Flex application? Or even better, want to see how to do in ActionScript something you only knew how to do with MXML? Well there's a really cool option that does just that. It's a special directive for the Flash compiler:

-keep-generated-actionscript=true

If you're using the Flex2 SDK, then you know how you use this directive with the compiler. If you're using FlexBuilder2 you'll need to make a small change to preferences. To show how to do this, let's start by making a quick Flex application and we'll call it "GeneratedActionScript" and click on Finish.

Start by opening Flex Builder (you can get the demo here) Right click on the folder for the new project we just created in the Navigator and click on Properties.

There are a large number of properties that you can set in FlexBuilder2. The cool thing is that they broke out the stuff we're interested in into it's own screen.

In the left menu, click on "Flex Compiler" and you will see a number of settings that are sent to the flex compiler whenever you compile this specific project. Notice that section right in the middle that says "Additional compiler arguments"? That's the part we're looking for. We want to add our new compiler argument to this list. There may already be arguments in this field. In my version, it had one directive regarding the local language. Add a space past any existing arguments, and add our magical "-keep-generated-actionscript=true"

Now is where the cool stuff comes in. When the Flash compiler compiles all of the code, it will not delete the ActionScript 3.0 code that was created to make your app work. You'll be able to see clearly how your MXML has been changed into ActionScript, and you'll be able to see how to accomplish similar tasks via ActionScript or the Flex Framework that you may have known nothing about before.

Let's give it a try. Let's see what we get if we create a simple FlexBuilder2 application and declare a button in MXML. We'll give it a name of "BIG BUTTON" and a font size to match (just so we can see these properties being set in ActionScript). Really it's just one line of non-generated code asking for a button. Four total lines of MXML to comprise the entire application:

Now we can test the new MXML and see if we get a big button (as expected we do):

But if you check out the project Navigator, you'll find a new folder called "generated". This is all the generated ActionScript code that was created to compile the SWF, but normally deleted unless the compiler is directed otherwise. Under this folder is all of the generated ActionScript, Including your MXML classes in a folder called "generated" within your project.

Inside this "generated" file folder, you may find all kinds of lines of code if you're using the Flex Framework. In our case, we're just going to take a peek at the ActionScript generated from us creating our big button:

When you actually look at what this is doing for you, you'll see that MXML is exactly ActionScript 3.0. An MXML file should be regareded as any other class file. In some cases it's easier to bust out some good ActionScript code. But in many cases, it can be simpler to use the MXML language to define your interfaces when you compare it to how you would do it in ActionScript 3.

Compile it the same way (with only the generated ActionScript code), and you get the same big button

There are a lot of special compiler directives and fun things that you can find out about how Flash/Flex works if you take some time to play with the SDK. I highly recommend taking a look deeper.

Need Professional Help For Your ActionScript Project?
ActionScript.com Consulting Services provide top quality professional ActionScript consulting to businesses around the globe. If you have a professional project in need to world-class talent, tell us about your project by requesting a quote today.

Reader Comments

Login to post your comments. If you do not have an account with us please Register.
Copyright 2005 by ActionScript, Inc.   |  Privacy Statement  |  Terms Of Use  |  ActionScript Client Extranet