Flex Builder is built on top of Eclipse, and it allows you to develop Flash applications on Linux.
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:
Design View
States View
Refactoring
Data Wizards
Cold Fusion Data Services Wizard
Web Services Introspection
Profiler
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.
When run, the program looks like Figure 2.
Figure 2. First Run of the Quiz Program as Seen in Firefox
As you see, the text is very small. You can set the text size by using htmltext instead of text. I also corrected the problem that the text is too close to the borders of the movie by adding padding, I assigned an ID (name) to the control, so I can refer to it in scripts, and I made it non-editable, which then gives us Listing 2.
I still need to add the answer selections as radio buttons and a Next button. In Listing 3, I have added our first bit of ActionScript, a function that evaluates whether the correct answer is selected and gives immediate feedback by way of a dialog box. Anything other than MXML in a project file is best kept inside CDATA tags, which prevent Flex from parsing it as XML. This applies to both ActionScript and HTML. ActionScript also can be stored in external files and loaded at runtime or during compilation.
Running the program now produces a single question, and clicking Next produces a simple message box (Figure 3).
Figure 3. Quiz Program with Answer-Checking
The dialog and other controls don't look “standard” for most operating systems, and developers will want to customize them. Flex and Flash support various “skinning” techniques that make it simple to change the appearance of controls, but those are beyond the scope of this article.
Obviously, this version of the quiz is only for testing purposes. It has one question and no provision for tabulating results. Now, it's time to create more questions. Because I'm deliberately not connecting to a server-side database for this article, I simply declared an array of data directly in the program's code.
It's a peculiarity of ActionScript (like its parent, ECMAScript) that it doesn't directly support multidimensional arrays. The workaround is to declare an array of arrays, as shown in Listing 4.
I made my question arrays and index variable global. I know it's frowned on, but it's convenient. Global variables must be defined outside all functions, so here I defined them immediately at the beginning of the code, before any function definitions.
In the application definition, I added the MXML creationComplete="initApp();", which says to run the function initApp after the form is initialized. initApp replaces the default text of the question and answers with the contents of the first column of the array.
For this article, the application is complete (Listing 4 shows the full, final code).
Flex is commercial software, totally nonfree (as in speech). It retails for $249. I worked with the trial version, which is free as in beer. It's labeled an alpha, but it worked extremely well. It literally never crashed. The missing features listed above didn't affect me much, but I'm not an experienced Eclipse or Flex user who might be depending on those things.
Adobe hasn't announced any plans to release Flex Builder 4 for Linux. However, it did just extend the free license of the Flex 3 alpha for more than a year. I was intrigued to find a Flex Builder project at Google Code, fb4linux (see Resources). A programmer is trying to single-handedly convert the Windows version to run on Linux. I installed it, and it seems to work surprisingly well. Unfortunately, the “More info” link leads to sole developer eshangrao's personal site, which is written in Chinese. Because I can't read Chinese, I can't say much more about it. The project is distributed with the original Adobe license and still requires a license code from Adobe to work.
In my next article on this discussion of Linux-based Flash/Flex development, I will evaluate Sprouts, a Ruby-centered development environment. Unlike Flex Builder, Sprouts is released under an open-source license (the MIT license). Sprouts is a command-line-only compiler and debugger, built around the Rake build language. I will give an overview of using Sprouts, how to port Flex Builder projects into the Sprouts environment, and I'll also finish the work on my Webcomics quiz, reading the questions from a server-based database and improving the appearance of the screens.