当前位置:首页 > 开发 > Web前端 > 前端 > 正文

给Flex的Tree赋值方式(XML和ArrayCollection)

发表于: 2012-11-30   作者:darrenzhu   来源:转载   浏览次数:
摘要: 1)方式一,mxml内嵌xml数据赋值方式,Embedded XMLListCollection <mx:Tree id="env_list" labelField="label" showRoot="true" width="243" alternatingItemColors="[#FFFFFF,
1)方式一,mxml内嵌xml数据赋值方式,Embedded XMLListCollection
<mx:Tree id="env_list" labelField="label" showRoot="true" width="243" alternatingItemColors="[#FFFFFF, #FFFFFF]">
<mx:XMLListCollection>
<mx:XMLList>
         <node label="Env Group1">
<node label="Env1"/>
<node label="Env2"/>
</node>
<node label="Env Group2">
<node label="EnvA"/>
<node label="EnvB"/>
</node>
</mx:XMLList>
</mx:XMLListCollection>
</mx:Tree>
Comments: in this way, no need to set value to dataProvider of the tree.


2)普通ArrayCollection方式,这里要用children或者categories关键字来指定某个结点的子结点,而且这两个关键字是不能改变的,它们被定义在tree的实现里面。Constant ArrayCollection with children or categories keywords
[Bindable]
private var treeEnvDataProvider:ArrayCollection=new ArrayCollection([
{node:"noneleaf",label:"Env Group1",children:[{node:"leaf",label:"Env11"},{node:"leaf2",label:"Env12"}]},
{node:"noneleaf",label:"Env Group2",children:[{node:"leaf",label:"Env21"},{node:"leaf2",label:"Env22"}]},
{node:"noneleaf",label:"Env Group3",children:[{node:"leaf",label:"Env31"}]}
]);

<mx:Tree id="env_list" labelField="label" showRoot="true" alternatingItemColors="[#FFFFFF, #FFFFFF]" dataProvider=”{treeEnvDataProvider}”/>
Comments: in this way we need use keywords children or categories.


3)元素为动态对象的ArrayCollection。ActionScript ArrayCollection with Object
[Bindable]
private var envGroups:ArrayCollection=new ArrayCollection();
private function mockupTreeEnvData():void{
           
           
             var obj:Object=new Object();
            obj.label="Env GroupA";
            obj.children=new ArrayCollection([{label:"Env1"}]);
           
           
            envGroups.addItem(obj);
           
            }
Comments: also we need use keywords “children” as the dynamic object’s property.


4)元素为对象的ArrayCollection方式,同样要用children关键字作为对象的一个属性来标明某结点的子结点。ActionScript ArrayCollection with domain object

[Bindable]
public class EnvironmentDTO
{
public function EnvironmentDTO()
{
}

public var id:String;
public var type:String;
public var label:String;
}

[Bindable]
public class EnvironmentGroupDTO
{
public function EnvironmentGroupDTO()
{
}
public var id:String;
public var type:String;
public var label:String;
public var children:ArrayCollection=new ArrayCollection();

}
  
private function mockupTreeEnvData():void{
             var group1:EnvironmentGroupDTO=new EnvironmentGroupDTO();
            group1.id="group1";
            group1.label="Env Group1";
            var env11:EnvironmentDTO=new EnvironmentDTO();
            env11.id="env11";
            env11.label="Env11";

            group1.children.addItem(env11);
            var evn12:EnvironmentDTO=new EnvironmentDTO();
            evn12.id="env12";
            evn12.label="Env12";
            group1.children.addItem(evn12);
                       
           
            envGroups.addItem(group1);
           
}

Comments: very important, we still need use the “children” keywords as a property of our domain object, otherwise, the tree cannot find where are the children of the non-leaf node.


5) Conclusion
When using XML object as the dataProvider of tree, things are looked easier and straightforward, while needing keywords “children” as the property of our object when using ArrayCollection.

给Flex的Tree赋值方式(XML和ArrayCollection)

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
研究了好久,终于发现如何将Tree的数据源绑定在ArrayCollection上了。这样就不用再将从数据库中取到
musicList.xml <?xml version="1.0" encoding="utf-8"?> <musicList> <root label="
接触Flex4一个多月,系统地了解了Flex4主要技术。近日想做一个Tree控件的Demo,但发现关于Flex4的很
txl.xml如下: <?xml version="1.0" encoding="utf-8"?> <data value="XX通讯录"> <
txl.xml如下: <?xml version="1.0" encoding="utf-8"?> <data value="XX通讯录"> <
ArrayCollection是Array数据类型的代理类,它的附加了很多功能,比如排序,游标的使用,数据筛选等
前面发了一个 html to tree 再发一个 xml to tree 以下为代码 /* 版权所有:版权所有(C) 2009 系统
<? xml version="1.0" encoding="utf-8" ?> < mx:Application xmlns:mx ="http://www.adob
<? xmlversion="1.0"encoding="utf-8" ?> < mx:Application xmlns:mx ="http://www.adobe.
1.tree 改变每一项的 icon图标 <?xml version="1.0" encoding="utf-8"?> <s:Application x
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号