As a web developer you may be wondering, "How do I start using Flex?" Adobe Flex is a very powerful set of tools but "...with great power comes great responsibility."

This article introduces you to Flex through basic examples and comparisons with HTML and PHP that you are already familiar with. Each section includes a stand-alone, working example that you can review. I'll begin with the basics like layout and then move on to more advanced topics such as form submission. The goal of this guide is to show you how easy it is to get started using Flex to build Rich Internet Applications.

Requirements

To make the most of this article, you need the following software and files:

Flex Builder 3

• Try
• Buy

Sample files:

• flex_php_samples.zip (ZIP, 40K)

Table of Contents

• Running the Flex/PHP code examples
• Creating the user interface
• Submitting a form using the GET method to PHP
• Submitting a form using the POST method to PHP
• Populating a list with XML from the server
• Navigating to another URL or targeting a frame
• Changing states in Flex
• Downloading a file
• Uploading a file to PHP
• Login example application
• Populating a DataGrid with XML from PHP
• Taking your projects to the next level

Running the Flex/PHP code examples

The sample files contain a Flex Builder 3 archive project that includes all of the examples discussed in this article. You can import this project directly into Flex Builder or Eclipse (after installing the Flex Builder plug-in) by selecting File > Import > Flex Project and navigating to the file.

Open the project "src" directory to see the MXML files. Each of these MXML files, which are also called applications, can be run in a web browser. Right-click the file in the Flex Navigator (or the Package Explorer in Eclipse) and choose the option to "Run Application". MXML files differ from HTML files in that MXML files are compiled into a SWF file, which is then run from within an HTML page referencing the SWF file.

Flex Builder 3 automatically compiles the MXML code into a SWF file every time you save the file or the first time you choose "Run Application" from the Flex Builder menu. When you run the application, Flex Builder also automatically opens the application in the default browser on your system.

To specify the default application, right-click a file name and select the option to "Set as Default Application" from the context menu. The blue dot signifies the default application to run.

Note: The Flex Builder 3 project contains a folder of PHP files, which must be deployed to a PHP web application server (see the following instructions) in order to run the examples. Once the server is setup, described below, Flex Builder copies this folder to the web server when the project is built.

Deploying Flex examples on your local workstation web server

Follow the steps below to publish the PHP files to your local web server so that you can view them:

1. If you do not already have a PHP-enabled web server installed, install XAMPP (for Windows) or MAMP (for Macintosh OS X).
2. After installing the appropriate software linked above, start your local web server.
3. In Flex Builder 3, choose Project > Properties. The Flex Builder 3 Project Properties window appears.
4. Select the Flex Build Path tab. In the output folder, choose a directory on your localhost web server.
1. On Windows, the path is:
   C:\XAMPP\xampp\htdocs or C:\XAMPP\xampp\htdocs\myproject
2. On Mac, the path is:
   /Applications/MAMP/htdocs or /Applications/MAMP/projects/test
5. In the Output folder URL field, enter the URL to the output folder.
1. On Windows, enter: http://localhost/ or http://localhost/myproject
2. On Mac, enter: http://localhost:8888 or http://localhost:8888/projects/test

After setting up the local web server, you can test your projects in Flex Builder and they will launch in the browser and run from the server (http://localhost) rather than the local file system (file://path/to/project/bin-debug/myproject.html).

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License

Page 1 of 12

Next Page

About the authors