Flex中如何将一个数组Array作为Tree的数据提供元的例子

By Minidxer | December 28, 2008

接下来的例子演示了Flex中如何将一个数组Array作为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.         <![CDATA[
  9.             private function tree_labelFunc(item:Object):String {
  10.                 var suffix:String = "";
  11.                 if (tree.dataDescriptor.hasChildren(item)) {
  12.                     suffix = " (" + item.children.length + ")";
  13.                 }
  14.                 return item.name.toUpperCase() + suffix;
  15.             }
  16.         ]]>
  17.     </mx:Script>
  18.  
  19.     <mx:Array id="arr">
  20.         <mx:Object name="One">
  21.             <mx:children>
  22.                 <mx:Array>
  23.                     <mx:Object name="Two" />
  24.                     <mx:Object name="Three" />
  25.                     <mx:Object name="Four">
  26.                         <mx:children>
  27.                             <mx:Array>
  28.                                 <mx:Object name="Five" />
  29.                                 <mx:Object name="Six" />
  30.                             </mx:Array>
  31.                         </mx:children>
  32.                     </mx:Object>
  33.                     <mx:Object name="Seven">
  34.                         <mx:children>
  35.                             <mx:Array>
  36.                                 <mx:Object name="Eight" />
  37.                             </mx:Array>
  38.                         </mx:children>
  39.                     </mx:Object>
  40.                     <mx:Object name="Nine" />
  41.                 </mx:Array>
  42.             </mx:children>
  43.         </mx:Object>
  44.     </mx:Array>
  45.  
  46.     <mx:Tree id="tree"
  47.             dataProvider="{arr}"
  48.             labelFunction="tree_labelFunc"
  49.             width="200" />
  50.  
  51. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

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

Search Posts