Set Icons for Items in a List : List « Components « Flex






Set Icons for Items in a List

Set Icons for Items in a List
           
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Canvas width="400" height="300">
        <mx:Script>
            
    
                [Bindable]
                private var dp:Array = [{name:"A", position:"a"}, 
                                        {name:"B", position:"b"}, 
                                        {name:"C", position:"c"},
                                        {name:"D", position:"d"}];
    
                [Embed(source="a.png")]
                private var managerIcon:Class;
    
                [Embed(source="a.png")]
                private var designerIcon:Class;
    
                [Embed(source="a.png")]
                private var accountantIcon:Class;
    
                [Embed(source="a.png")]
                private var developerIcon:Class;
    
                private function setIcon(value:*):Class
                {
                    if(value.position != null)
                    {
                        switch(value.position)
                        {
                            case "developer":
                                return developerIcon;
                            break;
                            case "designer":
                                return designerIcon;
                            break;
                            case "accountant":
                                return accountantIcon;
                            break;
                            case "manager":
                                return managerIcon;
                            break;
                        }
                    }
                    return null;
                }
    
          
        </mx:Script>
        <mx:List width="200" 
                 id="listImpl" 
                 labelField="name" 
                 dataProvider="{dp}" 
                 editable="true" 
                 iconFunction="setIcon"/>
    </mx:Canvas>
</mx:Application>

   
    
    
    
    
    
    
    
    
    
    
  








Related examples in the same category

1.Populating List using ActionScriptPopulating List using ActionScript
2.Using a List component to display a single column of namesUsing a List component to display a single column of names
3.Create List from ObjectsCreate List from Objects
4.Create a static List controlCreate a static List control
5.Set the verticalAlign for ListSet the verticalAlign for List
6.Set the variableRowHeight for ListSet the variableRowHeight for List
7.Set wordWrap and variableRowHeightSet wordWrap and variableRowHeight
8.Remove from ListRemove from List
9.Remove an item from listRemove an item from list
10.Replace item in a ListReplace item in a List
11.Call JavaScript when double clicked the List itemCall JavaScript when double clicked the List item
12.Double click to edit ListDouble click to edit List
13.Spark List Caret IndexSpark List Caret Index
14.Spark List with alternating Item ColorsSpark List with alternating Item Colors
15.List rollover colorList rollover color
16.List IconList Icon
17.A List control uses the iconFunction property to determine the icon to display for each itemA List control uses the iconFunction property to determine the icon to display for each item
18.Give a list of color namesGive a list of color names
19.If items do not fit in the size of the control, Flex automatically display scroll barsIf items do not fit in the size of the control, Flex automatically display scroll bars