Adobe is changing the world through digital experiences. Our creative, marketing and document solutions empower everyone — from emerging artists to global brands — to bring digital creations to life and deliver them to the right person
at the right moment for the best results.

Preorder Estimated Availability Date. Your credit card will not be charged until the product is shipped. Estimated availability date is subject to change.Preorder Estimated Availability Date. Your credit card will not be charged until the product is ready to download. Estimated availability date is subject to change.

Prerequisite knowledge

User level

Required products

Sample files

In this exercise you will use the application you made in Exercise 1.6 (Creating MXML custom components with ActionScript properties) to create an ActionScript class and use instances of the class to populate employee data (see in Figure 1).

Create an ActionScript class

Download the ex2_07_starter.zip file if you haven't done so already and extract the file ex2_07_starter.fxp to your computer.

Open Flash Builder.

Import the ex2_07_starter.fxp file.

Right-click on the components directory and select New > ActionScript class.

Name the class Employee (see Figure 2).

Figure 2. Name the new class Employee.

Keep the default settings and click Finish.

Within the class declaration, type imageFile and press CTRL+1 to invoke the quick assist tool and select the Create instance variable imageFile option. This creates a private variable. Change private to public and change the data type to the String class by using the content assist tool (CTRL+Space).

public class Employee
{
public var imageFile:String;
...

Repeat step 7 to create two more public variables named firstName and lastName.

Note: When the argument names in the constructor match the class property names, it is a best practice to add this to the constructor argument name so that you can differentiate between the constructor arguments and the class property names. In this case, the argument names and the class property names are different, so you do not need to add this to the constructor argument names.

Save the file.

Create instances using ActionSctipt

In this section, you will create multiple employee instances with ActionScript.

Within the Script block, type firstEmployee and use the quick assist tool (CTRL+1) to create a private variable and use the content assist tool (CTRL+Space) to data type the variable to the Employee class (see Figure 3).

Figure 3. Use content assist to define the data class of the firstEmployee variable.

Within the Script block, ensure the components.Employee package was imported. If not, add the following code to import the package:

Populate the name field

In this section you reuse the createFullName() function to dynamically display the employee name below the BitmapImage control.

Open the EmployeeDisplay.mxml file.

Locate the Label control.

Bind the text property to the employeeData variable evaluated by the createFullName() function:

<s:Label x="10" y="92"
text="{employeeData.createFullName()}"/>

Save the file.

Run the application.

The components now display the employee's names (see Figure 7).

Figure 7. View the application with employee names.

In this exrecise you learned how to create an ActionScript class and use instances of it to display data. In the next exercise you will convert this ArrayCollection of generic objects into an ArrayCollection of typed data.