Flex

I got Flex working yesterday. It was something I tried with Bug Tunnel Defense but never got working; the best I managed was it building without errors but without finishing. I.e. once I'd fixed all the compiler errors the compiler would take forever. This was impossible to diagnose, I could not share the project with anyone else to see if they had any insights, so I had to give up.


This time I tried it with a relatively small and new project, that consists of only ten mostly small source files and one graphic asset. I eventually got it working, but it took much more time than it should have.


The main problem is Flex is pretty poorly documented. There's no single place where everything is clearly defined. What documentation there is mostly describes features of Flex that are irrelevant for game making: the layout engine and components, i.e. the bits that correspond to the editor in Flash CS. A lot of information is online, but much of it is out of date.


I started off with a 'main.mxml' file, which after a few versions looked like this



<?xml version="1.0" encoding="utf-8"?>
<mx:Application
  xmlns:mx="http://www.adobe.com/2006/mxml"
  layout="absolute"
  width="666"
  height="500"
  frameRate="60"
  applicationComplete="appComplete()">
<mx:Script>
<![CDATA[
private function appComplete():void
{
this.addChild(new DisplayObjectUIComponent(new Rings()));
}
]]>
</mx:Script>
</mx:Application>

This worked but is unnecessary. I can just ignore mxml and compile my main class directly. I turned this into a batch file I could run from within TextWrangler

#!/bin/sh

cd ~/Flash/Rings/code

mxmlc Rings.as -o ../../../Sites/Rings.swf

The most annoying part of doing this is the code changes. First to specify the game properties I had to add a 'SWF' tag, immediately before the main class definition, i.e.

[SWF(width="666", height="500", backgroundColor="#000000", frameRate="60")]

public final class Rings extends Sprite {

But the annoying part is the graphics code which looks like this

[Embed(source="../Art/2009doily.jpg")]

private var gfxDiscClass:Class;

public function Make():void {

bmpDoily = new gfxDiscClass();

gDoily = bmpDoily.bitmapData;

And that's for just one graphic asset. It does avoid messing around with Flash CS but in practice I'm going to have to maintain two versions as I need to use Flash CS to debug, and may also need it to add a pre-processor. There no way I can see to write code that works with both compilers: no conditional compilation, using e.g. preprocessor directives or macros. So I'll have to write two versions of the code, for the time being in one file which I'll update as needed.

The last thing I had to do was tweak the Flash CS generated HTML, changing the scaling from 'Default (show all)' to 'No scale'. I don't know why this was suddenly needed: there's clearly some subtle difference in the generated SWF which the documentation gives no clue about.

Apart from faster development the other benefit of using Flex is the Flex compiler is better, with more options and better warnings. As well as a lot I didn't care about it showed me a few I actually should have fixed (a missing type and some functions missing return types), and I'm happy to fix the pointless warnings so I get to see the useful ones.