Using the List component

You can set up a list so that users can make either single or multiple selections. For example, a user visiting an e-commerce website needs to choose which item to buy. There are 30 items, and the user scrolls through a list and selects one by clicking it.

You can also design a list that uses custom movie clips as rows so you can display more information to the user. For example, in an e-mail application, each mailbox could be a List component and each row could have icons to indicate priority and status.

List component parameters

The following are authoring parameters that you can set for each List component instance in the Property inspector or in the Component Inspector panel:

data An array of values that populate the data of the list. The default value is [] (an empty array). There is no equivalent runtime property.

labels An array of text values that populate the label values of list. The default value is [] (an empty array). There is no equivalent runtime property.

multipleSelection A Boolean value that indicates whether you can select multiple values (true) or not (false). The default value is false.

rowHeight indicates the height, in pixels, of each row. The default value is 20. Setting a font does not change the height of a row.

You can write ActionScript to set additional options for List instances using its methods, properties, and events. For more information, see List class.

Creating an application with the List component

The following procedure explains how to add a List component to an application while authoring. In this example, the list is a sample with three items.

To add a simple List component to an application, do the following:

  1. Drag a List component from the Components panel to the Stage.
  2. Select the list and select Modify > Transform to resize it to fit your application.
  3. In the Property inspector, do the following:
    • Enter the instance name myList.
    • Enter Item1, Item2, and Item3 for the labels parameter.
    • Enter item1.html, item2.html, item3.html for the data parameter.
  4. Select Control > Test Movie to see the list with its items.

    You could use the data property values in your application to open HTML files.

The following procedure explains how to add a List component to an application while authoring. In this example, the list is a sample with three items.

To add a List component to an application, do the following:

  1. Drag a List component from the Components panel to the Stage.
  2. Select the list and select Modify > Transform to resize it to fit your application.
  3. In the Actions panel, enter the instance name myList
  4. Select Frame 1 of the Timeline and, in the Actions panel, enter the following:
    myList.dataProvider = myDP;
    

    If you have defined a data provider named myDP, the list will fill with data. For more information about data providers, see List.dataProvider.

  5. Select Control > Test Movie to see the list with its items.