在Flex缺省的Tree组件中,如果要打开某个节点的话,点击节点本身是不好用的,只能点击节点前面的那个很小的“三角符号”,这种用户体验其实是很糟糕的。不过我们可以通过Tree 中的 itemClick 事件来自己实现这个事情。
假设我们有一个Tree,它的id=”tree”,定义一个它的itemClick事件处理函数 itemClickHandler:
private function tree_itemClick(evt:ListEvent):void {
var item:Object = Tree(evt.currentTarget).selectedItem;
if (tree.dataDescriptor.isBranch(item)) {
tree.expandItem(item, !tree.isItemOpen(item), true);
}
}
代码很简单,就是先获取到当前点击的节点,判定它是否是一个枝节点,然后将它的打开状态更改。
最后在Tree中设置 itemClick=”itemClickHandler(event)” 就OK了。
main.mxml(英文链接地址:http://blog.flexexamples.com/2008/04/05/opening-branches-by-clicking-rows-in-a-tree-control-in-flex/)
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/04/05/opening-branches-by-clicking-rows-in-a-tree-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
import mx.collections.ICollectionView;
import mx.events.ListEvent;
private function tree_itemClick(evt:ListEvent):void {
var item:Object = Tree(evt.currentTarget).selectedItem;
if (tree.dataDescriptor.isBranch(item)) {
tree.expandItem(item, !tree.isItemOpen(item), true);
}
}
private function tree_labelFunc(item:XML):String {
var children:ICollectionView;
var suffix:String = "";
if (tree.dataDescriptor.isBranch(item)) {
children = tree.dataDescriptor.getChildren(item);
suffix = " (" + children.length + ")";
}
return item[tree.labelField] + suffix;
}
]]>
</mx:Script>
<mx:XML id="dp">
<root>
<folder label="One">
<folder label="One.A">
<item label="One.A.1" />
<item label="One.A.2" />
<item label="One.A.3" />
<item label="One.A.4" />
<item label="One.A.5" />
</folder>
<item label="One.1" />
<item label="One.2" />
</folder>
<folder label="Two">
<item label="Two.1" />
<folder label="Two.A">
<item label="Two.A.1" />
<item label="Two.A.2" />
</folder>
</folder>
</root>
</mx:XML>
<mx:Tree id="tree"
dataProvider="{dp}"
showRoot="false"
labelField="@label"
labelFunction="tree_labelFunc"
width="300"
rowCount="6"
itemClick="tree_itemClick(event);" />
</mx:Application>
posted on 2008-09-02 19:27
lvq810 阅读(1318)
评论(0) 编辑 收藏 所属分类:
Open Framekwork