Developing Flash Applications with Flex Builder

I miss programming. For years, I developed software for large companies, first using Lotus Notes and then Macromedia Flash. I have spent the past three years in a totally nonprogramming job, developing Web sites, writing whitepapers and otherwise doing nontechnical things. I like writing, but I miss programming. I wanted to get back into development, and as a Linux Journal writer, I wanted to use free software if possible. The thing is, my background is all in not only proprietary but also highly specialized software. I have never programmed in C or Java or Perl or any of the other popular general-purpose languages. I certainly could learn one, but I would prefer not to start from scratch with a whole new system at this stage of my career.

One way forward was to create Flash applications in Flex. Flash originally was created as an animation player. Its scripting language, ActionScript, originally was a way to script object animation, but it has developed into a full-featured object-oriented programming environment for general-purpose applications. It is an implementation of the ECMAScript 4 draft, meaning that it is compatible with the newest JavaScript engines. However, many traditionally trained developers find Flash's animation-oriented timeline development system confusing and unfamiliar. The solution was the development of Flex, which allows programmers to create Flash applications using more standard tools and the more familiar metaphor of drawing controls on a form and assigning them behaviors.

After Adobe bought Macromedia, it released the Flex SDK under the Mozilla Public License, so it now is possible to develop Flash applications using entirely free software. It also has released an alpha version of its Eclipse-based Flex Builder development environment for Linux. Flex Builder is released under a proprietary license.

Flex applications also can be defined using MXML, an XML dialect that is used to lay out the user interface and other aspects of the program, such as data bindings. Behaviors still are defined using ActionScript.

Flash applications generally run in the browser. They offer many of the advantages of AJAX or Silverlight applications, including a stateful client that can update specific items without reloading the entire page, and the Flash Player sandboxes applications in much the same way that a Java applet is restricted for security reasons.

Another innovation, AIR (Adobe Integrated Runtime) lets applications run off-line. AIR lets ActionScript developers create true freestanding programs that do not require a Web browser. However, they still are restricted by the Flash “sandbox”, which limits what changes can be made on the local system. AIR apps also can include HTML and JavaScript.

Perhaps the two best-known AIR applications are the Pandora Internet radio player and TweetDeck, which streamlines the Twitter experience. Both work on Linux.

In this article, I demonstrate how to create a simple Flash application using Adobe Flex Builder on a Linux system. In a follow-up article, I'll move on to totally open-source development using Project Sprouts.

Flex is an Eclipse-based environment. In order to use it, you must have certain prerequisite software installed: Eclipse 3.3.x, Sun JRE 1.5 or newer and Mozilla Firefox 3.0.

Note that the system requirements refer specifically to Eclipse 3.3. If you use a higher version, installation will succeed, but Eclipse will fail to open code editors. I installed version 3.3.2 from eclipse.org (see Resources) in my $HOME directory. You can install 3.3 alongside 3.5 on the same computer, as long as you start version 3.3 to use Flex. Simply untar the download and place it anywhere in the filesystem. I put it in $HOME/eclipse.

I was able to use Flex Builder with Mozilla Firefox version 3.5, however, rather than the called-for 3.0 without problems. One Firefox tip: I use the NoScript plugin. At first, I thought the context-sensitive help in Flex Builder wasn't working, but it turns out that I had to allow scripts from 127.0.0.1:51296.

Also, note that you must install the Sun JRE. GCJ will not work with Flex.

To make debugging work, you must download and install the debugging version of the Flash Player (see Resources). Amusingly, when you try to run Adobe's installer on Ubuntu 9.10 (Karmic Koala), it complains because you don't have libc6 “higher” than 2.3. In fact, Karmic ships with version 2.10 (read as “2 dot 10”), which is higher than 2.3 in version-speak but not in normal numbering. I edited the script to remove the version check by commenting out these lines:

#GLIBCSTATUS=`check_glibc`
#case $GLIBCSTATUS in
#  invalid-glibc)
#    exit_glibc
#    ;;
#esac

With those edits, the install completed without further problems.

You can download the Flex alpha from Adobe's Web site (see Resources), and you need to create a free account first. Once you have it downloaded, do a chmod u+x on the file and run the downloaded file to install. Flex Builder uses a Windows-style graphical wizard installer. I installed into /home/carlf/AdobeFlexBuilderLinux, which meant I did not need to become superuser to complete the installation.

To use Flex Builder, simply start Eclipse. Being old-school, I did this by typing ./eclipse/eclipse & in a GNOME terminal (Figure 1).

Figure 1. Flex Builder

The first time you run Eclipse after installing Flex Builder, you must create a new Workspace. Simply click File→Switch Workspace→Other and create a new folder.

Flex Builder for Linux, as an alpha, is missing several features present in the Windows and Mac versions:

Depending on the type of project you are planning, these features may be either critical or unimportant.

Because this was my first experience with Eclipse, I took time to review the Eclipse tutorials before closing the Welcome screen. To switch from the default Java development environment to Flex, click Windows→Open Perspective→Other, and select Flex Development. Now, create a Flex project by clicking File→New→Flex Project. I chose to create a browser-based SWF file and named it “FirstProject”.

For this first simple application, I decided to create a simple Internet quiz that asks the user some questions, then supplies a “Webcomics IQ” score (I'm a big fan of Webcomics). This let me avoid having to worry about server database access on my first project. For this project, I need to use MXML to draw a simple form, which contains a question (text field) and four possible answers (radio buttons), along with a Next button. When the user clicks Next, the next question is displayed in the text field. After the last question, the score is displayed.

Because Flex Builder for Linux lacks a GUI painter (the Design View is absent), I created the components by typing MXML code into the editor. First, I write the text of the first question.