method One: Depending on whether there are child nodes to change
Copy Code code as follows:
<fx:Style>
@namespace S "Library://ns.adobe.com/flex/spark";
@namespace mx "LIBRARY://NS.ADOBE.COM/FLEX/MX";
Mx| tree{
/* Remove default folder icon * *
Folderclosedicon:embed (source= ' resource/region.png ');
Folderopenicon:embed (source= ' resource/region.png ');
/* Remove leaf node icon
Defaultleaficon:classreference (NULL);
*/
/*
DEFAULTLEAFICON Specifies the leaf icon
A closed branch node is displayed next to the icon specified by Disclosureclosedicon. The default icon is a black triangle.
An open branch node is displayed next to the icon specified by Disclosureopenicon. The default icon is a black triangle.
Folderclosedicon closes a branch node of the specified folder icon.
FOLDEROPENICON specifies a branch node of the Open folder icon.
For example: Triangle icon to modify the following code can be replaced with their own:
Disclosureopenicon:embed (source= ' resource/region.png ');
Disclosureclosedicon:embed (source= ' resource/region.png ');
*/
}
</fx:Style>
method Two: According to the properties of the node, flexible change Icon
Copy Code code as follows:
<?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" minwidth= "955" minheight= ">"
<fx:Script>
<! [cdata[
]]>
</fx:Script>
<fx:Declarations>
<!--place non-visual elements (such as services, value objects) here-->
<fx:xml id= "Treedata" >
<root>
<node label= "CI Configuration Items" iconname= "Computer.png" >
<node label= "Resources" iconname= "Computer.png" >
<node label= "Hardware Resources" iconname= "Computer.png" >
<node label= "Hardware Device" iconname= "Computer.png" >
</node>
<node label= "Hardware module" iconname= "Computer.png" >
<node label= "Port" iconname= "Computer.png" >
</node>
</node>
</node>
</node>
</node>
<node label= "dictionary" iconname= "Dictionary.png" >
</node>
</root>
</fx:XML>
</fx:Declarations>
<mx:tree left= "5" top= "5" bottom= "5" width= "" dataprovider= "{treedata}"
Id= "Mytree"
Showroot= "false"
Labelfield= "@label"
Itemrenderer= "Com.flex.tree.dynamicicontree.IconTreeRenderer" >
</mx:Tree>
</s:Application>
Package Com.flex.tree.dynamicicontree
{
Import flash.xml.*;
Import mx.collections.*;
Import Mx.controls.Image;
Import mx.controls.listclasses.*;
Import mx.controls.treeclasses.*;
Import Mx.styles.StyleManager;
/*
* ICON Tree Rendering device
*/
public class Icontreerenderer extends Treeitemrenderer
{
protected Var myimage:imagerenderer;
private var imagewidth:number = 16;
private var imageheight:number = 16;
private static var defaultimg:string = "Windows.png";
Public Function Icontreerenderer ()
{
Super ();
}
Override protected function Createchildren (): void
{
Super.createchildren ();
MyImage = new Imagerenderer ();
Myimage.source = defaultimg;
Myimage.width=imagewidth;
Myimage.height=imageheight;
Myimage.setstyle ("VerticalAlign", "Middle");
AddChild (MyImage);
}
Dynamically set the tree node icon by overwriting the data method
Override public Function set data (value:object): void
{
Super.data = value;
var imagesource:string=value. @iconName. toString ();
if (imagesource!= "")
{
Myimage.source=imagesource;
}else{
myimage.source=defaultimg;
}
}
Hide the original icon and set its coordinates
Override protected function Updatedisplaylist (Unscaledwidth:number, unscaledheight:number): void
{
Super.updatedisplaylist (Unscaledwidth, unscaledheight);
if (Super.data!=null)
{
if (Super.icon!= null)
{
myimage.x = super.icon.x;
Myimage.y = 2;
Super.icon.visible=false;
}
Else
{
myimage.x = super.label.x;
Myimage.y = 2;
super.label.x = myimage.x + myimage.width + 17;
}
}
}
}
}
Package Com.flex.tree.dynamicicontree
{
Import Mx.controls.Image;
public class Imagerenderer extends Image
{
private var defaulturl:string = "assets/icon/";
public Var iconname:string;
Public Function Imagerenderer ()
{
Super ();
}
Override Public Function set source (url:object): void{
Super.source = defaulturl + URL;
Iconname = URL as String;
}
}
}