flex 创建右键菜单

转载自：http://blog.csdn.net/youqishini/article/details/8008459

每次使用网盘如“115网盘”时都可以使用定制的右键菜单很是方便，都想在WEB中怎么实现这个右键菜单呢？到现在也没有摸清楚。不过，右键菜单在Flex中却可以很容易就实现了。

          Flex中创建右键菜单现实内容的类是ContextMenuItem类。ContextMenuItem 类表示上下文菜单中的项。每个ContextMenuItem 对象都有一个显示在上下文菜单中的标题（文本）。要向上下文菜单中添加新项，需要将其添加到 ContextMenu 对象的 customItems 数组。 利用 ContextMenuItem 类的属性，您可以启用或禁用特定菜单项，也可以显示或隐藏菜单项。可以为 menuItemSelect 事件编写事件处理函数，以便在用户选择菜单项时为其添加功能。

        当然，定义右键菜单可以定制全局右键菜单，也可以定制特有的右键菜单，例如只有在DataGrid上才显示一个菜单，但是在其他地方则不显示。下面这段代码为本人写的一个小demo:

[html] view plaincopyprint?
<?xmlversionxmlversion="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
              xmlns:s="library://ns.adobe.com/flex/spark" 
              xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="app_creationCompleteHandler(event)"> 
    <fx:Script> 
       <![CDATA[
           import flash.utils.clearInterval;
           import flash.utils.setInterval;
          
           import mx.collections.ArrayCollection;
           import mx.collections.IList;
           import mx.controls.Alert;
           import mx.controls.dataGridClasses.DataGridItemRenderer;
           import mx.core.FlexGlobals;
           import mx.events.CloseEvent;
           import mx.events.FlexEvent;
           import mx.events.ListEvent;
           [Bindable]private var contextMenuCustomItems:Array;
           [Bindable]private var cm:ContextMenu;
           [Bindable]private var songList:ArrayCollection=new ArrayCollection([
              {showName:'恋上另一个人',songer:'游鸿明',filmName:'chirsyu_lslygr.flv'},
              {showName:'一天一万年',songer:'游鸿明',filmName:'chirisyu_ytywn.flv'},
              {showName:'下沙',songer:'游鸿明',filmName:'chirisyu_xs.flv'},
              {showName:'五月的雪',songer:'游鸿明',filmName:'chirisyu_wydx.flv'},
              {showName:'楼下那个女人',songer:'游鸿明',filmName:'chirisyu_lxngnr.flv'},
              {showName:'白色恋人',songer:'游鸿明',filmName:'chirisyu_bslr.flv'}
           ]);
           protected function app_creationCompleteHandler(event:FlexEvent):void
           {
              // TODOAuto-generated method stub
              Alert.okLabel="确定";
              Alert.yesLabel="是";
              Alert.cancelLabel="否";
              var aboutUserMenu:ContextMenuItem=new ContextMenuItem("关于我们",true,true);
               aboutUserMenu.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,aboutUserMenuHandler);
              contextMenuCustomItems=FlexGlobals.topLevelApplication.contextMenu.customItems;
              contextMenuCustomItems.push(aboutUserMenu);
              var linkMenu:ContextMenuItem=new ContextMenuItem("联系作者",true,true);
              linkMenu.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,linkHandler);
              contextMenuCustomItems.push(linkMenu);
           }
           private function aboutUserMenuHandler(event:ContextMenuEvent):void{  
              Alert.show("我的网盘 V1.0","提示");
           }
           protected function showList_clickHandler(event:MouseEvent):void
           {
              var obj:Object=showList.selectedItem;
              var fileName:String=obj['showName']
              if(fileName!=""){
                  createContextMenu("删除歌曲",buyHandler);
                  showList.contextMenu=cm;
              }
           }
           private function linkHandler(event:ContextMenuEvent):void{
              Alert.show("QQ:996475895","提示");
           }
          
           private function createContextMenu(menuName:String,fun:Function):void
           {
              cm = new ContextMenu();
              cm.hideBuiltInItems();
              var customItemsArr:Array = new Array();
              var customMenuItem:ContextMenuItem = newContextMenuItem(menuName,true,true);
              customMenuItem.addEventListener("menuItemSelect", fun);
              customItemsArr.push(customMenuItem);
              cm.customItems = customItemsArr;
           }
          
           private function buyHandler(event:ContextMenuEvent):void
           {
              var showName:String=showList.selectedItem['showName'];
              Alert.show('确实要删除歌曲"'+showName+'"吗？',"提示",Alert.YES|Alert.CANCEL,this,yesOrCancleHandler,null,Alert.CANCEL);
           }
           private function yesOrCancleHandler(event:CloseEvent):void{
              if(event.detail==Alert.YES){
                  var index:int=showList.selectedIndex;
                  songList.removeItemAt(index);
                  showList.dataProvider=songList;
              }
           }
       ]]> 
    </fx:Script> 
    <fx:Declarations> 
       <!-- Place non-visualelements (e.g., services, value objects) here --> 
    </fx:Declarations> 
    
       <mx:DataGrid id="showList" x="228" y="97" width="563" height="355" 
                   click="showList_clickHandler(event)"dataProvider="{songList}"  fontSize="16" fontWeight="bold"> 
           <mx:columns> 
              <mx:DataGridColumn headerText="歌曲名" dataField="showName" width="250"/> 
              <mx:DataGridColumn headerText="演唱者" dataField="songer" /> 
              <mx:DataGridColumn headerText="链接地址" dataField="filmName" visible="false" /> 
           </mx:columns> 
       </mx:DataGrid> 
  
</s:Application> 



      此文件创建了一个全局右键菜单和一个局部右键菜单：当鼠标没有选择DataGird数据时显示的是“关于我们”，“联系作者”这两个菜单，当选中了DataGird的一个数据时则显示“删除歌曲”右键菜单。
    当然，右键菜单的命名也是有规则的，如下所示：
向上下文菜单添加的自定义菜单项不得超过 15 个。
每个标题至少必须包含一个可见字符。
控制字符、换行符和其他空白字符将被忽略。
任何标题的长度都不能超过 100 个字符。
与任何内置菜单项或其他自定义菜单项相同的标题将被忽略，不管匹配的菜单项是否可见。菜单标题在与内置标题或现有自定义标题比较时将不考虑大小写、标点符号或空白。
不允许使用以下标题，但可以将这些词与其它词结合使用以形成自定义标题（例如，尽管不允许使用“粘贴”，但却允许使用“粘贴感觉良好”）：

           Save
           Zoom In
           Zoom Out
           100%
            Show All
            Quality
            Play
            Loop
            Rewind
            Forward
            Back
            Movie not loaded
            About
            Print
            Show Redraw Regions
            Debugger
            Undo
            Cut
            Copy
            Paste
            Delete
            Select All
            Open
            Open in new window
            Copy link
不管是本身还是与其它词结合使用，以下任何一个词都不能出现在自定义标题中：
            Adobe
           Macromedia
           Flash Player
           Settings

         注意：如果播放器运行在非英语系统上，标题字符串将同时与英语列表和对应的本地化字符串进行比较。例如我开始直接添加了“删除”。结果怎么都添加不上，原来“删除”与“Delete”是对应的。后来改成了“删除歌曲”才添加成功的！
 
         不过有一个小小的遗憾的，如果将此DataGrid添加到一个容器如Panel中时，右键菜单则失效，原因是Flex只有顶级容器才能创建右键菜单，后续我在看看这种情况下的右键菜单创建。