Normaly, a custom tree item must have a property named children.
This property contains other tree items...
public class GroupVO
{
public var groupName: String;
public var children : Array;
public function addChild(vo:GroupVO):void{
this.children.addItem(vo);
}
}
So here is how you want your tree to be populated:
private function populateTree():void{
var root:GroupVO = new GroupVO();
var subRoot1:GroupVO = new GroupVO();
var subRoot2:GroupVO = new GroupVO();
var subSubRoot1:GroupVO = new GroupVO();
var subSubRoot2:GroupVO = new GroupVO();
subRoot1.addChildren( subSubRoot1 );
subRoot2.addChildren( subSubRoot2 );
root.addChildren( subRoot1 );
root.addChildren( subRoot2 );
//Your dataProvider must be a collection containing a single root object
//and the flex tree will know how to display it correctly by looking at
the children property recusivly
yourTree.dataProvider = new ArrayCollection();
yourTree.dataProvider.addItem( root );
// This result in
//-Root
// -subRoot1
// -subSubRoot1
// -subRoot2
// -subSubRoot2
}
I hope this helps.
--- In [email protected], venkat eswar <[EMAIL PROTECTED]> wrote:
>
> i have one doubt.i have to create a tree(group like chat application).
actually i am using an array and that values has to be displayed as
children.Here it is groupArr.also the groupName has to be kept as root
and the array values has to be the children of the root (ie groupName).
>
>
>
>
> <?xml version="1.0" encoding="utf-8"?>
> <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"; width="448"
height="454">
>
> <mx:Script>
> <![CDATA[
> import mx.controls.Alert;
>
> import mx.controls.CheckBox;
> import mx.collections.ArrayCollection;
> import mx.events.CollectionEvent;
> import com.screencasterlive.model.DataManager;
> import org.igniterealtime.xiff.data.im.RosterItem;
> import com.screencasterlive.events.JabberEvent;
>
>
>
> public var obj:Object = new Object();
>
>
> [Bindable]
> private var dataManager:DataManager=DataManager.getInstance();
>
>
> private function saveGroup(evt:Event):void
> {
>
>
> var idx:int;
>
> var len:int = dataManager.userGroup.length;
>
> for (idx=0; idx<len; idx++)
> {
> if (groupCheck[idx].selected)
> {
> dataManager.groupArr.push(groupCheck[idx].label);
> }
>
> }
>
> dataManager.groupName = GroupNameText.text;
>
> Alert.show(dataManager.groupArr.toString());
>
> obj.groupArr = dataManager.groupArr;
> obj.groupName = dataManager.groupName;
> trace(obj.groupName);
> trace(obj.groupArr);
> groupListBox.visible = false;
> formName.visible = false;
> treeGroupBox.visible = true;
>
> tree.dataProvider = dataManager.groupArr;
>
>
>
> }
>
>
>
> ]]>
> </mx:Script>
>
>
> <mx:TitleWindow x="61" y="10" width="316" height="399"
layout="absolute" showCloseButton="true">
> <mx:Form width="296" id="formName" verticalScrollPolicy="off"
horizontalScrollPolicy="off">
> <mx:FormItem label="Group Name" width="265">
> <mx:TextInput id="GroupNameText" width="176"/>
> </mx:FormItem>
> </mx:Form>
>
> <mx:VBox y="62" x="26" id="groupListBox">
> <mx:Repeater id="r" dataProvider="{dataManager.userGroup}">
> <mx:CheckBox id="groupCheck"
label="{r.currentItem.toString()}" />
> </mx:Repeater>
> </mx:VBox>
>
> <mx:VBox id="treeGroupBox" visible="false" x="10" y="122"
height="107" width="226" verticalScrollPolicy="off"
horizontalScrollPolicy="off">
> <mx:Tree id="tree" height="190" verticalScrollPolicy="off"
horizontalScrollPolicy="off" width="251">
>
> </mx:Tree>
> </mx:VBox>
> <mx:Button x="74" y="327" label="Save" emphasized="true"
> click="saveGroup(event);"/>
> <mx:Button x="147" y="327" label="Cancel" />
>
> </mx:TitleWindow>
>
>
> </mx:Canvas>
>
