Flex中Tree的用法备忘（增删改查节点）

最新推荐文章于 2024-10-18 10:41:41 发布

Emma23_23

最新推荐文章于 2024-10-18 10:41:41 发布

阅读量844

点赞数

分类专栏： flex

本文链接：https://blog.csdn.net/catherine0_0/article/details/16826013

版权

flex 专栏收录该内容

79 篇文章

订阅专栏

本文介绍了一种使用 Flex 中的 XMLTree 控件构建动态树形结构的方法。通过解析 XML 数据源并将其显示为树形结构，用户可以方便地浏览和操作数据。文章详细解释了如何初始化 Tree 控件、响应选择变化、添加和删除节点等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<?xml version="1.0" encoding="utf-8" ?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="doInit()" fontSize="15">
<mx:HDividedBox right="5" left="5" bottom="5" top="114">
<mx:TextArea height="100%" width="100%" wordWrap="false" id="textarea">
<mx:text>
<![CDATA[ 
<node label="菜单">
 <node label="瑰姿艳逸"/>
 <node label="气若幽兰"/>
 <node label="华容婀娜"/>
    <node label="翩若惊鸿"/>
    <node label="其他">
        <node label="婉若游龙"/>
        <node label="荣曜秋菊"/>
        <node label="华茂春松">
         <node label="明眸善睐"/>
         <node label="腰如约素"/>
         <node label="瑰姿艳逸"/>
        </node>
    </node>
</node>
 
  ]]> 
  </mx:text>
  </mx:TextArea>
  <mx:Tree width="100%" height="100%" labelField="@label" id="tree" change="onChange()" allowMultipleSelection="true" /> 
  </mx:HDividedBox>
  <mx:Button x="10" y="10" label="设置Tree的Model" click="refresh1()" /> 
<mx:Script>
<![CDATA[ 
  import mx.controls.Alert;
  import flash.utils.setTimeout;
  import mx.collections.*;
  private function onChange():void {
   if(tree.selectedItem!=null) {
    var xml:XML=tree.selectedItem as XML;
    addText.text=xml.@label;
   }
  }
  private function doInit():void {
   refresh1();
  }
  private function refresh1():void {
   var list:XMLList=null;
   try {
    list=new XMLList(textarea.text);
   } catch (e:Error) {
    Alert.show("xml模型非法");
   }
   if(list!=null) {
    tree.dataProvider=list;
    tree.validateNow();
    setTimeout(expandAll,100);  
   }    
  }
  private function expandAll():void {
   tree.selectedIndex=0;
   //trace(tree.selectedIndex);
   if(tree.selectedItem!=null) {
    //trace(tree.selectedItem);
    tree.expandChildrenOf(tree.selectedItem,true);
   }
  }
  private function addAfter():void {
   var xml:XML=tree.selectedItem as XML;
   var text:String=addText.text;
   if(xml!=null && text.length>0) {
    var parent:XML=xml.parent();
    if(parent!=null) {
     var child:XML=new XML("<node label=\"\"/>");
     child.@label=text;
     parent.insertChildAfter(xml,child);
    } else {
     Alert.show("不能选中根节点");
    }
   } else {
    Alert.show("需要先选中节点和填入文字");
   }
  }
  private function addBefore():void {
   var xml:XML=tree.selectedItem as XML;
   var text:String=addText.text;
   if(xml!=null && text.length>0) {
    var parent:XML=xml.parent();
    if(parent!=null) {
     var child:XML=new XML("<node label=\"\"/>");
     child.@label=text;
     parent.insertChildBefore(xml,child);
    } else {
     Alert.show("不能选中根节点");
    }
   } else {
    Alert.show("需要先选中节点和填入文字");
   }   
  }
  private function addSub():void {
   var xml:XML=tree.selectedItem as XML;
   var text:String=addText.text;
   if(xml!=null && text.length>0) {
    var child:XML=new XML("<node label=\"\"/>");
    child.@label=text;
    xml.appendChild(child);
    tree.expandChildrenOf(xml,true);
   } else {
    Alert.show("需要先选中节点和填入文字");
   }   
  }
  private function delSel():void {
   var xml:XML=tree.selectedItem as XML;
   if(xml!=null) {
    var list:Array=tree.selectedItems as Array;
    for(var k:int=0;k<list.length;k++) {
     xml=list[k] as XML;
     var parent:XML=xml.parent();
     if(parent!=null) {
      var children:XMLList=parent.children();
      for(var i:int=0;i<children.length();i++) {
       if(children[i]==xml) {
        delete children[i];
        break;
       }
      }
     } else {
      Alert.show("不能选中根节点");
     }
    }
   } else {
    Alert.show("需要先选中节点");
   }   
  }
  private function modifyLabel():void {
   var xml:XML=tree.selectedItem as XML;
   var text:String=addText.text;
   if(xml!=null && text.length>0) {
    xml.@label=text;
   } else {
    Alert.show("需要先选中节点");
   }   
  }
  private function selAll():void {
   var text:String=searchText.text;
   if(text.length>0) {
    var items:Array=[];
    var list:XMLList=new XMLList();
    list[0]=tree.dataProvider[0];    
    searchItems(list,text,items);
    tree.selectedItems=items;
   } else {
    Alert.show("输入查找的文字");
   }
  }
  private function searchItems(list:XMLList,find:String,items:Array):void {
   for(var i:int=0;i<list.length();i++) {
    var one:XML=list[i];
    var label:String=one.@label;
    if(label!=null && label.indexOf(find)>=0) {
     items.push(one);
    }
    searchItems(one.children(),find,items);
   }
  }
  
 
  ]]> 
  </mx:Script>
  <mx:Label x="10" y="46" text="增加节点:" /> 
  <mx:TextInput x="90" y="44" width="127" id="addText" /> 
  <mx:Button x="225" y="44" label="增加为弟" click="addAfter()" /> 
  <mx:Button x="323" y="44" label="增加为哥" click="addBefore()" /> 
  <mx:Button x="421" y="44" label="增加为孩子" click="addSub()" /> 
  <mx:Button x="193" y="10" label="删除选中节点" click="delSel()" /> 
  <mx:Button x="563" y="44" label="修改标签" click="modifyLabel()" /> 
  <mx:TextInput x="124" y="76" width="127" id="searchText" text="华" /> 
  <mx:Text x="259" y="78" text="的节点" /> 
  <mx:Button x="10" y="76" label="选中包含：" click="selAll()" /> 
  </mx:Application>