Flex中如何利用expandItem()和expandChildrenOf()展开或关闭Tree的各层节点的例子

By Minidxer | December 27, 2008

接下来的例子演示了Flex中如何利用expandItem()和expandChildrenOf()展开，或关闭Tree的各层节点。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Script>
  8.         private function tree_expandItem(evt:MouseEvent):void {
  9.             if (tree.selectedItem &amp;&amp; tree.dataDescriptor.isBranch(tree.selectedItem)) {
  10.                 tree.expandItem(tree.selectedItem, checkBox.selected);
  11.             }
  12.         }
  13.  
  14.         private function tree_expandChildrenOf(evt:MouseEvent):void {
  15.             if (tree.selectedItem &amp;&amp; tree.dataDescriptor.isBranch(tree.selectedItem)) {
  16.                 tree.expandChildrenOf(tree.selectedItem, checkBox.selected);
  17.             }
  18.         }
  19.     </mx:Script>
  20.  
  21.     <mx:XML id="xmlDP">
  22.         <root>
  23.             <node label="The">
  24.                 <node label="quick">
  25.                     <node label="brown" />
  26.                     <node label="fox" />
  27.                     <node label="jumped">
  28.                         <node label="over" />
  29.                     </node>
  30.                 </node>
  31.                 <node label="the" />
  32.             </node>
  33.             <node label="lazy">
  34.                 <node label="dog." />
  35.             </node>
  36.         </root>
  37.     </mx:XML>
  38.  
  39.     <mx:ApplicationControlBar dock="true">
  40.         <mx:Button id="button1"
  41.                 label="expandItem(...)"
  42.                 click="tree_expandItem(event);" />
  43.         <mx:Button id="button2"
  44.                 label="expandChildrenOf(...)"
  45.                 click="tree_expandChildrenOf(event);" />
  46.  
  47.         <mx:Spacer width="100" />
  48.  
  49.         <mx:CheckBox id="checkBox"
  50.                 label="open:"
  51.                 labelPlacement="left"
  52.                 selected="true" />
  53.     </mx:ApplicationControlBar>
  54.  
  55.     <mx:Tree id="tree"
  56.             dataProvider="{xmlDP.node}"
  57.             labelField="@label"
  58.             showRoot="false"
  59.             width="200"
  60.             rowCount="6" />
  61.  
  62. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Tree | No Comments » | 1,702 views Tags: , , ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll