[flex]flex tree施用心得
[flex]flex tree使用心得
目录
-
关键属性
- labelField
- dataProvider
- 事件
切换行号显示
<mx:Tree id="resTree" width="100%" height="100%" labelField="@label" dataProvider="{resTmp}" showRoot="true" alternatingItemColors="[#FFFFFF,#EEDDEE]" doubleClickEnabled="true" indentation="15"/>
关键属性
labelField
- 作为标签显示的字段名称
- 默认使用"label"查找, 注意xml时需要加"@"符号
- 可以通过修改labelField,显示自己需要的标签(如下xml,需要配置为labelField="fullName")
切换行号显示
<all fullName="根节点"> <man fullName="张三"/> <man fullName="李斯"/> </all>
- 对于上面的xml数据,tree如果没有配置labelField,那么label文本将使用XMLNode as String输出.
dataProvider
- 用作数据绑定
- 绑定后Tree类将按照下列方式处理源数据对象:
- 样本xml:
切换行号显示
<all fullName="根节点"> <man fullName="张三"/> <man fullName="李斯"/> </all>
- 将包含有效 XML 文本的 String 转换为 XMLListCollection
切换行号显示
tree.dataProvider = xmlString;
- 将 XMLNode 转换为 XMLListCollection
切换行号显示
tree.dataProvider = XML(xmlString);
- 将 XMLList 转换为 XMLListCollection
切换行号显示
tree.dataProvider = XML(xmlString).elements("man");
- 将实现 ICollectionView 接口的任何对象转换为 ICollectionView
-
将 Array 转换为 ?ArrayCollection
- 将任何其它类型的对象作为 Array 的唯一条目纳入该 Array 中
- json方式,定义如下,然后dataProvider="{json}"即可,注意这里的labelField默认为label,可以生效,xml时使用labelField="@label",xml时需要加@符号
切换行号显示
[Bindable] public var json:Object = new Object(); json = [{ label: 'root', children: [{ label: 'host', children: [{ label: 'windows' }, { label: 'linux' }] }] }];
- 样本xml:
事件
- itemClick、doubleClick等产生event事件
- event中读取数据;
切换行号显示
var obj:Object = event.itemRenderer.data; trace("当前数据:", obj);
- trace输出叶子节点可能为空,实际上obj有数据,切记切记
- event中读取数据;