Search Flex Samples

Displaying the number of children in each branch of a Flex Tree control

The following example shows how you can display the number of children in each branch of a Tree control in Flex by using the dataDescriptor property, labelFunction property, hasChildren() method and getChildren() method.




<?xml version="1.0" encoding="utf-8"?>



<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:Script>

<![CDATA[

private function tree_labelFunc(item:XML):String {

var label:String = item.@label;

if (tree.dataDescriptor.hasChildren(item)) {

label += " (" + tree.dataDescriptor.getChildren(item).length + ")";

}

return label;

}

]]>

</mx:Script>



<mx:XML id="treeDP">

<root>

<node label="i) One" />

<node label="i) Two" />

<node label="i) Three" />

<node label="i) Four">

<node label="ii) One" />

<node label="ii) Two" />

<node label="ii) Three">

<node label="iii) One" />

<node label="iii) Two" />

</node>

<node label="ii) Four" />

</node>

<node label="1. Five" />

<node label="1. Six" />

</root>

</mx:XML>



<mx:Tree id="tree"

dataProvider="{treeDP}"

labelFunction="tree_labelFunc"

showRoot="false"

width="200" />



</mx:Application>




0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples