How do you change the Tree Component Icons?

Question

Hi,
I have been trying to get to grips with the tree component. I
want to
customise it so that I can have a different icon for each
different link.
E.g. a QT logo for a video etc. If no valuse is found for the
'icon'
attribute it will just display the default.
Within my XML file I have created a new attribute for each
link called
'icon' and has a value of 'movie.gif' or something similar.
In my flash file, I have created the following code:
theTree.iconFunction = function (node:XMLNode) {
var iconNode:String = item.attributes.icon;
if (iconNode != undefined) {
return iconNode;
However, it does not seem to work. My knowledge of
ActionScript is pretty
poor so I assume I have made a mistake in there somewhere.
Can anyone help
me with this?
Thanks!

Answer 1

Check out the Component Reference... you change the icon for
a single node, as far as I know there's no automated process beyond
that. So assuming your tree component instance is named "theTree"
you might do this to change the icon of the first node:
theTree.dataProvider = yourXML; // make sure you don't try to
change the icon before you load data into the tree
var theNode = theTree.getTreeNodeAt(0); // the first node in
your tree
theTree.setIcon(theNode,'myIcon'); // set the icon
Where "myIcon" is a MovieClip you have in your library that
you have set the "linkage identifier" as "myIcon".
That iconFunction doesn't make a whole lot of sense to me,
because first of all I don't know why it would be attached to
theTree, and second it's referring to "item" which is not defined,
and third its taking the parameter "node" and not doing anything
with it. But perhaps there is some cool way to make a single
function which handles icons for your entire tree automatically,
that would certainly be nice.
However, like I said, as far as I know that function will do
nothing without calling tree.setIcon() in some way. I just made a
function which might do what you want -- it recursively loops
through an entire tree and sets it's icon based on the XML
attribute "icon":
function setAllIcons(branch){
for(var i in branch.childNodes){
var node = branch.getTreeNodeAt(i);
theTree.setIcon(node,node.attributes['icon']);
if(node.hasChildNodes){
setAllIcons(node);
So basically, you run setAllIcons(theTree.dataProvider) after
you have loaded and applied the XML.