Learning Flex – Lesson 8, Using Controls and Repeaters with Datasets

Flex has a group of list based controls that inherit from ListBase and allow the user to scroll through a list of items and select one or more of them. These include DataGrid, HorezontalList, List, ComboBox, TileList and Tree.

All of these use a dataProvider property to define the source of their data. This allows a level of abstraction between the data provider (or model) and the component (or view). This facilitates things like populating multiple components from the same data, switching data providers at runtime and having changes to the data reflected in all components that use it.

Horizontal and Tile List Components

Both of these list components display a list of items, the specific elements of which are defined by the developer. Horizontal lists will display a scroll bar along the bottom if required to view all items. A tile list displays items in a dynamically created set of rows and columns of equal sized tiles. The direction property can be used to force horizontal or vertical layout and scroll bars can be added to one axis.

Displaying data elements in a list control

If you just want to display a single text element from a data provider, this can be achieved by specifiying the element name in the labelField property of the list.

To combine data from several fields, you need to set the labelFunction property instead. This should be the name of a function you write that accepts a parameter of type Object and returns a String. An example would be –

private function listMultiString(item:object):String{
return item.name+" $"+item.price;

To display items in other ways, you’ll need to define an item renderer.