Friday, August 27, 2010

Part 1.3 Getting ANT up and running

We are now going to compile our little Hello World application. Normally we'd be using Flex Builder for this, choosing build from the context menu or CTRL-B-ing our way to some fun. Remember however that we don't want to use FB for compilation so we are going for a proper build system approach.
On the surface this seems like a lot of work for something FB can achieve for us very simply, but as we'll discover the further we get through these tutorials, it becomes a very powerful tool in our hands. Hopefully you'll use these powers for good rather than evil...
I'm actually going to provide the build file this time, and then we are going to work our way through it. I'm not going to provide a full set of learning ANT documentation, there is plenty of that out there if you are interested.


  • Turn off every "build before..." setting you can find in FB, they slow things down and through off what we want to deploy!
  • Add another folder to your setup folder called build, and under that add a file called build.xml.
  • Make sure the FLEX_HOME environment variable is set to the Flex SDK you want to use.
  • Grab the Flex Tasks jar file from your SDK folder and place it into the libs directory of your project.
Here's the code we're going to be adding to the build file. This is a pretty simple file, and doesn't include many if any of the optimizations and tweaks that ANT provides.

We now need to get this running.


  • Open the ANT view in Flex Builder. You should have this already installed if you've followed the previous parts of the tutorial.
  • Choose to add a buildfile and choose the projects buildfile
We should see the below.
Double click the compile target, and assuming everything has been set up properly, the SWF will be generated in the target directory.
We can clean the folder structure back up by running the clean task, ready to be committed to source control once we are satisfied that the code works.

Part 1.2 Project Structure.

First of all create a new Flex LIBRARY project. Though we are going to be generating swfs, we aren't going to be having Flex Builder do it.

Why? Well we aren't going to be the only ones creating the swfs. In a properly ordered world, we developers only build our code to test it, make sure it's working, compiling, and then we leave it. If we want to run a Continuous Integration process for example, we need to be building the artifacts in some other way than FB.


Now create the folder structure the same as the image. I'll explain why we have all these top level folders.
  • conf - Short for configuration. This is where we are going to add the files that we use to dynamically configure the application at runtime. We keep these separate from the source files deliberately. These configuration files are able to be changed without (necessarily) recompiling the application.
  • libs - We keep all the libraries for the project. We will have a combination of Flex SWCs and Java JARs in here, split up by language.
  • setup - We are going to be keeping our build files in here along with any other files we use to generate artifacts. This might be additional config files for the Flex compiler for example.
  • src - Our main source directory. All our source code which will end up in production will end up in here.
  • target - This directory can be removed later on as we will be creating it on the fly. This is where all the compiled artifacts end up, this includes production SWFs, SWCs or Test SWFs.
  • test - Where all our test code is going. This includes mocks and additional files in order to create the unit tests.
  • util - This is where all the useful bits and pieces go that don't fit in elsewhere. Server start up scripts, Value Object generation scripts( like xDoclet ), etc.
In preparation for the next part of the tutorial, we're going to add some additional files.
  • Under source, add the following chain of folders com / codecradle / tutorial / application / view
  • In this final folder add a simple HelloWorld MXML application (Hint, don't choose new MXML Application under the context menu, choose MXML component and then set up the application manually. If you choose the MXML Application, FB tries to do all sorts of clever things we don't want it to do). We'll call this something nice and imaginative... like Tutorial.mxml ;)
  • Change the output folder in FB to "target" rather than "bin" just so FB doesn't keep trying to create it.
So by the end of this part, we should have something like the image below. Like all the other parts of this tutorial, add a comment if you have any questions!

More Flex : Hero information comes out

Deepa has furnished us with some more Hero related snippets, and they make some interesting reading.

Deepa's posting

The first spec of the Spark Datagrid makes an appearance, which as suspected, was closer to the Halo Datagrid rather than the AdvancedDataGrid. *makes sign to ward off evil*

There's some good reading in the rest of the spec's that have been posted up to the Open SDK site. The size report looks like it might be useful pre-production, and the RSL Enhancements is worth a read just to get more information on how the Flash Player handles loading of RSLs generally.

Other than this, we still need to wait to get a proper nightly build. Deepa's implication is that the impetus for this was on the Player team rather than Flex SDK team to get their stuff done (or maybe I'm reading too much into it ;) ) as Hero is closely tied to the new player features.

Lastly, it looks like Hero is semi-officially Flex 4.5 rather than 5. Rumours as to what will be in 5.0 starting in 3... 2... 1...