要为Tree添加线,可以使用itemRenderer来自定义每个节点的显示样式。具体步骤如下:
- 创建一个自定义的itemRenderer类,继承自TreeItemRenderer。
package { import flash.display.Graphics; import mx.controls.treeClasses.TreeItemRenderer; public class CustomTreeItemRenderer extends TreeItemRenderer { override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight); var g:Graphics = graphics; g.clear(); if (data) { var tree:Tree = Tree(listData.owner); var depthColor:uint = getDepthColor(tree, data); // 绘制线条 g.lineStyle(1, depthColor); g.moveTo(0, 0); g.lineTo(tree.indentation, 0); // 绘制节点图标 var icon:Class = getStyle("folderIcon"); if (icon) { var iconInstance:DisplayObject = new icon(); addChild(iconInstance); setChildIndex(iconInstance, 0); iconInstance.x = tree.indentation; iconInstance.y = (unscaledHeight - iconInstance.height) / 2; } } } private function getDepthColor(tree:Tree, data:Object):uint { // 根据节点深度设置不同的颜色 var depth:int = TreeListData(listData).depth; var colors:Array = tree.getStyle("lineColors"); return colors[depth % colors.length]; } } }
- 在创建Tree时,为其设置itemRenderer属性为自定义itemRenderer类。
var tree:Tree = new Tree(); tree.itemRenderer = new ClassFactory(CustomTreeItemRenderer);
这样,每个节点都会绘制一条连接到父节点的线,并显示相应的节点图标。您还可以根据需要进一步修改自定义itemRenderer类的样式和逻辑。