Creating the first Flex application

In the previous article, the author has introduced Ria, Flex technology and Flex Builder 2 set into the development environment. Beginning with this article, you will begin to explain all aspects of using Flex Builder 2 to create flex applications. This article includes typical application development steps and the process of creating the first Flex application.

1. Application Development Steps

The process of creating a flex application is not complicated. Typically, the development steps for a typical application are as follows:

(1) Create the Mxml file using a text editor or Flex Builder 2, and add the Mxml root tag in the file, the code is as follows:

<?xml version="1.0" encoding="utf-8"? >
　　<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
　　</mx:Application>

(2) To design the user interface, add one or more containers and controls. If you do not add a container, the application will not have too many problems, but it is not conducive to the layout of the page and so on.

(3) Use styles and themes to enhance the design of the user interface.

(4) Add the content such as script, so as to realize dynamic behavior.

(5) Define and connect database services for data interaction.

(6) If the business rules require, you can add some data validation aspects of the implementation.

(7) Compile the application source code into a SWF file and run and test it.

These are typical steps for creating a flex application. More importantly, however, developers are also flexible to perform these steps based on specific application requirements.

In the following section, the process of creating the first Flex application is described.

2. Create the first Flex application

After you understand the process of creating a flex application, the first Flex application Helloflex is created below. This application is created using Flex Builder 2 (standalone installation), which allows the user to enter a paragraph in a text box, and the text appears on the page after the button is clicked. The process of creating an Helloflex application includes: (1) Creating a Flex project, (2) Setting the user interface and logic, (3) compiling the run.

Create Flex Project

For better management of flex application files, it is recommended that developers use Flex Builder 2 to create a flex project before creating a flex application. Here's a brief description of the process:

(1) Open Flex Builder 2, click Command menu: File > New > Flex Project. This will eject the new Flex Project Wizard, as shown in Figure 1:

Figure 1

As shown in Figure 1, the wizard first asks for the way the Flex application accesses data, including basic (elementary), ColdFusion Flash remote services (ColdFusion Flash Remoting Service), and Flex Data Services (Flex Data Services). Because this application does not require data access, select basic items.