List Control

The List control displays a vertical list of items. Its functionality is very similar to that of the SELECT form element in HTML. It often contains a vertical scroll bar that lets users access the items in the list. An optional horizontal scroll bar lets users view items when the full width of the list items is unlikely to fit. The user can select one or more items from the list.

CODE;

 

<?xml version=”1.0″?>

 

 <mx:Script>

 <![CDATA[

[Bindable]

public var selectedItem:Object;</mx:Script>

<mx:Model id=”mystates“>

<states>

<state label=”Alabama” data=”AL”/><mx:Panel title=”List Control Example” height=”75%” width=”75%” 10” paddingBottom=”10” paddingLeft=”10” paddingRight=”10“>

<state label=”Alaska” data=”AK”/>

<state label=”Arizona” data=”AZ”/>

<state label=”Arkansas” data=”AR”/>

<state label=”California” data=”CA”/>

<state label=”Colorado” data=”CO”/>

<state label=”Connecticut” data=”CT”/>

</states>

</mx:Model>

 

<mx:Label text=”Select a state to see its abbreviation.“/>

dataProvider=”{mystates.state}“change=”this.selectedItem=List(event.target).selectedItem”/>

<mx:List id=”source” width=”100%” color=”blue“{mystates.state}“this.selectedItem=List(event.target).selectedItem”/>

<mx:VBox width=”100%“>

<mx:Label text=”Selected State: {selectedItem.label}“/>

<mx:Label text=”State abbreviation: {selectedItem.data}“/>

</mx:VBox>

</mx:Panel>

<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml“>