Accessibility

Trio Motor Sample Article

 

Building the Trio Service Manager: The Work Order Status Widget in Flash MX 2004


Table of Contents

Building the Interface

The Service Manager status widget has four interface elements: a TextInput component, a ComboBox component, a ListBox component, and a Button component. When you have finished this tutorial, your interface will look like Figure 1, below.

The finished Service Manager status widget interface

Figure 1. The finished Service Manager status widget interface

First, add the UI Components.

  1. In Macromedia Flash MX 2004, open the file <your_web_root>/mx2004tutorial/extranetServiceOrders.fla from your web root folder, as covered in the readme.txt file. If you installed ColdFusion with Internet Information Server (IIS), your web root is typically c:\inetpub\wwwroot\. If you installed ColdFusion with the built-in web server, the web root is typically c:\CFusionMX\wwwroot\.
  2. In the Components panel under UI Components, drag a TextInput component instance onto the Stage. With the TextInput component instance selected, type the properties shown in Figure 2, into the Property inspector. Use the instance name license_txt for this component. (You can use the Transform tool to scale the component to the desired size, however, in this case, enter the exact width, height, and x and y coordinates.)

    Property inspector settings for license_txt TextInput component instance

    Figure 2. Property inspector settings for the license_txt TextInput component instance

  3. Add the ComboBox, List, and Button components to the Stage and set the following and instance name and properties in the Property inspector, just as you did for the TextInput component.

    Property inspector settings for the remaining three UI components

    Figure 3. Property inspector settings for the remaining three UI components

  4. Examine the final appearance, as shown in Figure 4. Note: It seems that the list box is larger than necessary, however, when this component is live this will not be the case. The margin is actually the second line.

    The Service Orders status widget interface.

    Figure 4. The Service Orders status widget interface.

  5. Select the Button.  In the Properties inspector, change the label property to Service Manager.
  6. Save the extranetServiceOrders.fla file.