DataGrid 之右键菜单

     Flex的右键菜单是通过contextMenu来实现的。谈到向DataGrid添加右键菜单，肯定有人会想到直接设置DataGrid的实例(id为dg，后面均用dg代替)的contextMenu属性就行了，还有人会想到通过设置itemRenderer来实现右键菜单功能。

     下面以个人观点分析下着两种方法。具体怎么实现就不说了，主要是谈论下各自的优缺点

     一、设置dg的contextMenu属性，这种方法的优点是代码简单、实现方便、让人容易看懂明白。缺点是，这样添加的右键菜单，是添加到整个dg上面了，在header上以及没有数据的地方都会出现右键菜单。当你想对某条数据实现右键功能时。这种方法很不准确，不能体现当前弹出的菜单对应的是哪条数据，试想header上弹出右键菜单“详细信息”会让人感觉很奇怪。

    二、通过设置itemRenderer来实现右键功能。优点是，它的优点正好弥补了第一种方法的缺点。他能非常准确的显示当前弹出的右键菜单对应的是哪条数据。并且在header和没有数据的地方不会弹出右键菜单，它的缺点是，个人感觉有点复杂，首先得新建itemRenderer类，在这个类里设置右键菜单，然后设置dg的itemRenderer。感觉不太方便比较麻烦。

    于是我想到了我自己的写法：

    其实就是添加了两个函数，感觉挺方便的。

代码

// 添加右键菜单
public  function  addContextMenu(cmArr:Array,menuItemSelFunc:Function): void {
     var  cm:ContextMenu = new  ContextMenu;
    cm.hideBuiltInItems();
    cm.addEventListener(ContextMenuEvent.MENU_SELECT,menuSelectEvt);
    dg.contextMenu = cm;
     for ( var  i:uint = 0 ;i < cmArr.length;i ++ ){
         var  cmi:ContextMenuItem = new  ContextMenuItem(cmArr[i],cmArr[i] == "" );
        cmi.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,menuItemSelFunc);
        cm.customItems.push(cmi);
    }
}
private  function  menuSelectEvt(e:ContextMenuEvent): void {
     var  cm:ContextMenu = e.currentTarget as ContextMenu;
     var  _dg:DataGrid = e.contextMenuOwner as DataGrid;
     var  _mouseRow:Number = Math.ceil((_dg.mouseY - _dg.headerHeight) / _dg.rowHeight)-1;
     var  dgDataCount:Number = _dg.dataProvider == null ? 0 :(_dg.dataProvider as IList).length;
    
     if (_mouseRow < 0 || _mouseRow > dgDataCount - 1 ){
         var  enabled:Boolean = false ;
        _dg.selectedIndex =- 1 ;
    } else {
        enabled = true ;
        _dg.selectedIndex = _mouseRow + _dg.verticalScrollPosition;
    }
     for ( var  i:uint = 0 ;i < cm.customItems.length;i ++ ){
         var  cmi:ContextMenuItem = cm.customItems[i];
        cmi.enabled = enabled;
    }
    _dg.validateNow();
}

 

      用的时候调用addContextMenu就行了。这个函数有两个参数，第一个是菜单数据，如：['详细信息','相关文件']，第二个参数就是菜单事件了。

      它的特点是，当鼠标点击到header或没有数据的地方时菜单是灰色的，只有点击到数据上时菜单才可用。