Question

I’d like to change icon of the node according to the attribute automatically/dynamically in Flex.
Bellow are my codes:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
           xmlns:s="library://ns.adobe.com/flex/spark"
           xmlns:mx="library://ns.adobe.com/flex/mx"
           width="540" height="610" chromeColor="#E8E50A">
<fx:Declarations>
    <fx:XMLList id="user_list">
        <node user="Running Center">
            <node user="System Administrator">
                <node icon="admin" user="admin" type="admin"/>
                <node icon="home" user="root" type="home"/>
            </node>
            <node user="Common User">
                <node icon="user" user="Udo" type="user"/>
                <node icon="user" user="Steven" type="user"/>
                <node icon="user" user="Peter" type="user"/>                    
            </node>         
        </node>
    </fx:XMLList>
</fx:Declarations>
<fx:Script>
    <![CDATA[
        [Bindable]
        [Embed(source="assets/admin.png")] 
        public var admin:Class; 

        [Bindable]
        [Embed(source="assets/home.png")] 
        public var home:Class; 

        [Bindable]
        [Embed(source="assets/user.png")] 
        public var user:Class; 
    ]]>
</fx:Script>
<mx:Tree id="user_tree" 
         x="10" y="51" width="206" 
         height="207" dataProvider="{user_list}"
         iconField="@icon" labelField="@user" showRoot="true" />
</s:Application>

Here is the effect image:

I’m sorry for I can’t post an image.
Bellow is the link.

https://i.stack.imgur.com/oZG6v.jpg

For example,maybe I should change the code like this?

<node icon="{...}" user="admin" type="admin"/>

Any help is greetful. Thanks in advance.

Answer 1

Here are some Google results for: “Flex tree iconFunction”

http://blog.flexexamples.com/2007/11/15/creating-a-custom-icon-function-on-a-flex-tree-control/

http://blog.flexexamples.com/2007/11/15/setting-a-custom-icon-field-in-a-flex-tree-control/