Flex的树形控件(Tree Control)中如何通过点击行进行展开/缩进的例子
2009-11-11 14:00
811 查看
Download: main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<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>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<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>
相关文章推荐
- Flex的树形控件(Tree Control)中如何通过点击行进行展开/缩进的例子
- Flex中如何利用树形控件(Tree Control)和SWFLoader控件创建简单图片相册的例子
- Flex中如何通过监听scroll事件检测用户改变DateChooser控件选中月份的例子
- Flex中如何通过设置separatorWidth样式来设定LinkBar控件各项目间分隔宽度的例子
- Flex中如何通过设置editable属性控制NumericStepper控件可编辑/不可编辑状态的例子
- Flex中如何通过设置cornerRadius样式设定NumericStepper控件边缘棱角圆滑幅度(corner radius)的例子
- Flex中如何通过disabledColor样式设置NumericStepper控件无效时文本颜色的例子
- Flex的NumericStepper控件中如何通过maxChars限制用户可以输入数字最大位数的例子
- Flex中如何通过设置fontFamily样式在ComboBox控件中使用自定义嵌入字体的例子
- flex 树形控件(Tree Control)的使用
- Flex中如何通过设置fontFamily样式在NumericStepper控件中使用嵌入字体的例子
- Flex中通过doubleClick事件来检测用户是否在TextInput控件中进行了双击(double clicks)操作的例子
- Flex中如何通过设置toolTipField属性在ButtonBar控件中设定自定义tool tip的例子
- Flex中如何通过borderStyle和borderSides样式设置NumericStepper控件特定边框(上下左右边)的例子
- Flex中如何通过borderColor样式设置DateField控件边框颜色的例子
- Flex中如何通过监听itemClick事件检测FlexRadioButtonGroup中RadioButton被点击的例子
- Flex中通过doubleClick事件来检测用户是否在TextInput控件中进行了双击(double clicks)操作的例子
- Flex中如何通过给openItems属性设置一个XMLList或Array对象来打开Tree的一个节点的例子
- Flex中如何通过设置backgroundAlpha风格来设定VideoDisplay控件的背景透明度(background alpha)的例子
- Flex的DateChooser控件中如何通过设置maxYear属性来设定允许的最大年限的例子