flashswing教你如何使用TREE组件

12年前

Tree 组件允许用户查看分层数据。

树中的每一项称为节点,并且可以是叶或分支。当展开分支时,将显示其子节点。分支的子项可以是叶或分支。

当树实例从单击或 Tab 键切换中获得焦点时,您可以使用以下按键来控制它:

说明
字母数字键 跳转到标签中以 Key.getAscii() 作为首字符的下一项。
向下箭头 将选区向下移动一项。
向上箭头 将选区向上移动一项。
Page Down 将选区向下移动一页。
Page Up 将选区向上移动一页。
End 将选区移到底端。
Home 将选区移到顶端。
向右箭头 打开所选的分支节点。如果分支已打开,则会移到第一个子节点。
向左箭头 关闭所选的分支节点。如果是在已关闭分支节点的叶节点上,则会移到父节点。
空格键 打开或关闭所选的分支节点。
Ctrl 允许选择和取消选择多个不相邻的项。
Shift 允许选择多个相邻的项。
Ctrl+向右箭头 内容向左移动一水平滚动行。
Ctrl+向左箭头 内容向右移动一水平滚动行。
Tab 将焦点移到下一个对象。
Shift+Tab 将焦点移到前一个对象。

以下示例演示树的属性,以及监听用户交互操作的结果。

从"库"面板中拖动相关组件到舞台(或直接通过 ActionScript 代码创建组件实例),并对实例命名;绘制图标元件,导出为类。

在主时间轴中选择第一帧,打开"动作"面板,然后输入以下代码:

import flash.events.Event;import shinater.swing.TreeCellRenderer;  TreeCellRenderer.setDefaultOpenIcon(FolderOpenIcon); TreeCellRenderer.setDefaultClosedIcon(FolderClosedIcon); TreeCellRenderer.setDefaultLeafIcon(FileIcon); my_tr.setCellRenderer(TreeCellRenderer); my_tr.addEventTreeener(Event.CHANGE, function(evt:Event){  selectedIndex_txt.text = my_tr.getSelectedIndex().toString();  var node:Object = my_tr.getSelectedNode();  if (node == null) {   selectedNode_txt.text = "null";  } else if (node is XML) {   selectedNode_txt.text = XML(node).toXMLString();  } else {   selectedNode_txt.text = "{label:\"" + node.label + "\", data:\"" + node.data + "\"}";  } }); my_tr.addTreeNode(<node label="1st Local Folders"><node label="Inbox" data="0"/><node label="Outbox" data="1"/></node>); my_tr.addTreeNode({label:"2nd Local Folders", children:[{label:"Inbox", data:"2"}, {label:"Outbox", data:"3"}]}); my_tr.addTreeNode({label:"Inbox", data:"4"}); 具体详细请参阅官方网站,同时也可以在这里检验到TREE组件的强大效果。