Flex使用<mx:Tree>控件创建树(可添加和删除节点)

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" ?? ??? ??? ??? ?layout="vertical" ?? ??? ??? ??? ?fontSize="12"> ?? ?<mx:Script> ?? ??? ?<![CDATA[ ?? ??? ??? ?import mx.controls.Alert; ?? ??? ??? ?import mx.collections.XMLListCollection; ?? ??? ??? ?[Bindable] ?? ??? ??? ?private var company:XML=<list> ?? ??? ??? ?? <department name="部门 A"> ?? ??? ??? ??? <employee name="小 A" /> ?? ??? ??? ??? <employee name="小 B" /> ?? ??? ??? ?? </department> ?? ??? ??? ?? <department name="部门 B"> ?? ??? ??? ??? <employee name="小 C" /> ?? ??? ??? ??? <employee name="小 D" /> ?? ??? ??? ?? </department> ?? ??? ??? ? </list>; ?? ??? ??? ?[Bindable] ?? ??? ??? ?private var companyData:XMLListCollection=new XMLListCollection(company.department); ?? ??? ??? ? ?? ??? ??? ?private function addNode():void ?? ??? ??? ?{ ?? ??? ??? ??? ?// 新建节点 ?? ??? ??? ??? ?var newNode:XML=<employee/>; ?? ??? ??? ??? ?newNode.@name=empName.text; ?? ??? ??? ??? ?// 添加节点 ?? ??? ??? ??? ?var xml:XML=XML(tree.selectedItem); ?? ??? ??? ??? ?if (xml.length() > 0) ?? ??? ??? ??? ?{ ?? ??? ??? ??? ??? ?xml[0].appendChild(newNode); ?? ??? ??? ??? ?} ?? ??? ??? ?} ?? ??? ??? ? ?? ??? ??? ?private function removeNode():void ?? ??? ??? ?{ ?? ??? ??? ??? ?if (tree.selectedItem != null) ?? ??? ??? ??? ?{ ?? ??? ??? ??? ??? ?var node:XML=XML(tree.selectedItem); ?? ??? ??? ??? ??? ?// 不能删除空节点和部门A，B ?? ??? ??? ??? ??? ?if (node == null || node.localName() == "department") ?? ??? ??? ??? ??? ?{ ?? ??? ??? ??? ??? ??? ?Alert.show("不能删除空节点和部门A，B！"); ?? ??? ??? ??? ??? ??? ?return; ?? ??? ??? ??? ??? ?} ?? ??? ??? ??? ??? ?// 获取当前节点的父节点下的所有子节点 ?? ??? ??? ??? ??? ?var children:XMLList=XMLList(node.parent()).children(); ?? ??? ??? ??? ??? ?// 将其转换为 XMLListCollection ?? ??? ??? ??? ??? ?var childrenCol:XMLListCollection=new XMLListCollection(children); ?? ??? ??? ??? ??? ?// 获取选中节点索引，并删除该节点 ?? ??? ??? ??? ??? ?var i:Number=childrenCol.getItemIndex(node); ?? ??? ??? ??? ??? ?childrenCol.removeItemAt(i); ?? ??? ??? ??? ?}else{ ?? ??? ??? ??? ??? ?Alert.show("请选中一个节点再进行删除！"); ?? ??? ??? ??? ?} ?? ??? ??? ?} ?? ??? ?]]> ?? ?</mx:Script> ?? ?<mx:Panel title="实现添加和删除节点" ?? ??? ??? ?? width="300" ?? ??? ??? ?? height="300" ?? ??? ??? ?? verticalAlign="middle" ?? ??? ??? ?? horizontalAlign="center"> ?? ??? ?<mx:Tree id="tree" ?? ??? ??? ??? ? dataProvider="{companyData}" ?? ??? ??? ??? ? labelField="@name" ?? ??? ??? ??? ? height="200" ?? ??? ??? ??? ? width="230"/> ?? ??? ?<mx:HBox> ?? ??? ??? ?<mx:TextInput id="empName" ?? ??? ??? ??? ??? ??? ?? width="60" ?? ??? ??? ??? ??? ??? ?? text="新节点名"/> ?? ??? ??? ?<mx:Button label="添加节点" ?? ??? ??? ??? ??? ??? click="addNode();"/> ?? ??? ??? ?<mx:Button label="删除节点" ?? ??? ??? ??? ??? ??? click="removeNode();"/> ?? ??? ?</mx:HBox> ?? ?</mx:Panel> </mx:Application>