Lets explore how we can hide text nodes from rendering in tree. Before hiding the text nodes, the tree looks like this (as per Example 1) with this XML
Start with a blank FLA, add a tree component to stage, name it “tree”, add a text area component name it “textArea”
Write the following in the first frame
[cc lang=”actionscript3″]
import mx.controls.Tree;
var tree:Tree;
//icon function is added here
tree.labelFunction = function (node) {
return node.nodeType == 1 ? node.nodeName : node.nodeValue;
};
var sample_xml:XML = new XML ();
sample_xml.ignoreWhite = true;
sample_xml.onLoad = function (done) {
if (done) {
tree.dataProvider = hideTextNodes (this);
}
};
sample_xml.load ('/downloads/sample.xml');
//
function hideTextNodes (x) {
for (var i = 0; i < x.childNodes.length; i++) {
if (x.childNodes[i].nodeType == 1) {
arguments.callee (x.childNodes[i]);
} else {
//text node found, hide it as property text
x.text == undefined ? x.text = x.childNodes[i].nodeValue : x.text += x.childNodes[i].nodeValue;
x.childNodes[i].removeNode ();
i--;
}
}
return x;
}
[/cc]
then write the following on the Tree
[cc lang=”actionscript3″]
on (change) {
var t = this.selectedNode.text;
if (t == undefined) {
t = '';
}
_parent.textArea.text = t;
}
