main.mxml
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
- layout="vertical"
- verticalAlign="middle"
- backgroundColor="white">
- <mx:Script>
- <![CDATA[
- import mx.events.TreeEvent;
- import mx.utils.ObjectUtil;
- private function tree_openItems_change(evt:TreeEvent):void {
- /* Set the array and let binding do the real work. */
- openItemArr = tree.openItems as Array;
- }
- ]]>
- </mx:Script>
- <mx:Arrayid="openItemArr" />
- <mx:XMLid="xmlDP">
- <node>
- <nodelabel="1.a" />
- <nodelabel="1.b" />
- <nodelabel="1.c">
- <nodelabel="1.c.i" />
- <nodelabel="1.c.ii" />
- <nodelabel="1.c.iii" />
- <nodelabel="1.c.iv" />
- <nodelabel="1.c.v" />
- </node>
- <nodelabel="1.d" />
- <nodelabel="1.e">
- <nodelabel="1.e.i" />
- <nodelabel="1.e.ii" />
- <nodelabel="1.e.iii">
- <nodelabel="1.e.iii.A" />
- </node>
- <nodelabel="1.e.iv" />
- </node>
- <nodelabel="1.f" />
- </node>
- </mx:XML>
- <mx:ApplicationControlBardock="true">
- <mx:Labeltext="Tree openItems length: {openItemArr.length}" />
- </mx:ApplicationControlBar>
- <mx:HDividedBoxwidth="100%">
- <mx:Treeid="tree"
- dataProvider="{xmlDP}"
- labelField="@label"
- showRoot="false"
- width="50%"
- rowCount="8"
- itemOpen="tree_openItems_change(event);"
- itemClose="tree_openItems_change(event);"/>
- <mx:Listid="list"
- dataProvider="{openItemArr}"
- labelField="@label"
- width="50%"
- height="100%"/>
- <mx:TextAreaid="textArea"
- editable="false"
- text="{ObjectUtil.toString(openItemArr)}"
- width="50%"
- height="100%"/>
- </mx:HDividedBox>
- </mx:Application>
本文展示了一个使用Adobe Flex框架创建的Tree组件实例。该实例通过双向绑定的方式实时更新树形结构的展开项,并同步显示在列表及文本区域中。代码中运用了mx:Tree和mx:List组件来实现树状数据的展示与交互。
3128

被折叠的 条评论
为什么被折叠?



