怎么给TWaver中的Node对象加右键菜单项

如何给TWaver中的Node对象加右键菜单项
选中树节点，多出一个按钮，可以用tree.iconsComponentsFunction（用法参考AlarmMappingDemo）。
菜单用Menu.createMenu（用法参考Flex如何定制Menu的Icon）

如果右键点击树节点时，让此节点选中最好，不过现在还没有通过ContextMenuEvent或者MouseEvent获得TreeData的方法，可以考虑先自己继承twaver.Tree，添加如下方法（TWaver Flex 1.5版本将添加）：
代码:
      public function getTreeDataByContextMenuEvent(event:ContextMenuEvent):TreeData{
         var itemRenderer:IListItemRenderer;
         var target:DisplayObject = event.mouseTarget;
         while (target && target != this) {
            if (target is IListItemRenderer && target.parent == listContent) {
               if (target.visible) {
                  itemRenderer =  IListItemRenderer(target);
               }
               break;
            }
           
            if (target is IUIComponent){
               target = IUIComponent(target).owner;
            } else {
               target = target.parent;
            }
         }
        
         if(itemRenderer != null){
            return this.getTreeDataByIndex(this.itemRendererToIndex(itemRenderer));
         }
         return null;
      }

      public function getTreeDataByMouseEvent(event:MouseEvent):TreeData{
         var itemRenderer:IListItemRenderer = this.mouseEventToItemRenderer(event);
         if(itemRenderer != null){
            return this.getTreeDataByIndex(this.itemRendererToIndex(itemRenderer));
         }
         return null;
      }
默认Menu上的Icon必须通过iconField和iconFunction去指定，但是这两种方式都必须用嵌入资源Class名字去指定Icon，如果想用动态的图片（比如URL）作为Menu的Icon，就必须定制一把MenuItemRenderer。



首先写个类CustomMenuItemRenderer继承MenuItemRenderer，里面增加一个如下变量作为自定义Icon的组件：

1
private var image:UIComponent = new UIComponent();
然后里面重写measure方法（计算MenuItem的宽高）：

01
override protected function measure():void {
02
    super.measure();
03

04
    if (separatorIcon || listData == null) {
05
        return;
06
    }
07

08
    var imageAsset:IImageAsset = Utils.getImageAsset(data.@iconName);
09
    if(imageAsset == null){
10
        return;
11
    }
12
    measuredWidth += imageAsset.width;
13
    if(imageAsset.height > measuredHeight){
14
        measuredHeight = imageAsset.height;
15
    }
16
}
重写commitProperties方法（重画并增加Icon，指定Icon宽高）：

查看源代码打印帮助

override protected function commitProperties():void {
	super.commitProperties();

	if (separatorIcon || listData == null) {
		return;
	}

	var imageAsset:IImageAsset = Utils.getImageAsset(data.@iconName);
	if(imageAsset == null){
		return;
	}
	image.width = imageAsset.width;
	image.height = imageAsset.height;
	image.graphics.beginBitmapFill(imageAsset.getBitmapData());
	image.graphics.drawRect(0, 0, image.width, image.height);
	image.graphics.endFill();
	if(!this.contains(image)){
		this.addChild(image);
	}
}

重写updateDisplayList方法（指定Icon的位置，由于Icon在左边，所以super一把后，再移动Labe等的位置）：

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
	super.updateDisplayList(unscaledWidth, unscaledHeight);

	if (separatorIcon || listData == null) {
		return;
	}

	var imageAsset:IImageAsset = Utils.getImageAsset(data.@iconName);
	if(imageAsset == null){
		return;
	}
	if(typeIcon){
		typeIcon.x += imageAsset.width;
	}
	if(label){
		label.x += imageAsset.width;
	}
}

重写measuredIconWidth方法（计算Icon的宽度）：

1
override public function get measuredIconWidth():Number {
2
    var imageAsset:IImageAsset = Utils.getImageAsset(data.@iconName);
3
    if(imageAsset == null){
4
        return 0 ;
5
    }else{
6
        var horizontalGap:Number = getStyle("horizontalGap");
7
        return imageAsset.width + horizontalGap;
8
    }
9
}
最后用自定义的CustomMenuItemRenderer指定Menu的ItemRenderer，注意使用iconName指定icon的名字（这里为TWaver注册图片的名字）。也可以用别的名字，注意把CustomMenuItemRenderer里面的@iconName换一下

1
var menu:Menu = Menu.createMenu(network, myMenuData, false);
2
menu.labelField = "@label";
3
menu.itemRenderer = new ClassFactory(CustomMenuItemRenderer);
4
var point:Point = network.getLogicalPoint(event.mouseEvent);
5
network.callLater(function():void{
6
    menu.show(point.x, point.y);
7
});
指定Menu数据的XML文件如下：

查看源代码打印帮助
01
    <mx:XML format="e4x" id="myMenuData">
02
        <root>
03
            <menuitem label="www.servasoftware.com" iconName="databox_icon">
04
                <menuitem label="TWaver" type="check" toggled="true">
05
                    <menuitem label="Java" type="radio" groupName="one"/>
06
                    <menuitem label="Web" type="radio" groupName="one" toggled="true"/>
07
                    <menuitem label="Flex" type="radio" groupName="one" iconName="bus_icon"/>
08
                    <menuitem label="Silverlight" type="radio" groupName="one"/>
09
                </menuitem>
10
                <menuitem type="separator"/>
11
                <menuitem label="2BizBox" iconName="data_icon"/>
12
            </menuitem>
13
            <menuitem label="www.2bizbox.com"/>
14
            <menuitem label="twaver.servasoft.com"/>
15
        </root>
16
    </mx:XML>
17
</code>
源代码见TWa