Flex4_Tree組件1(添加、刪除、展開、關閉、右鍵菜單)

1、屏蔽系統菜單：工程目錄“html-template”文件夾-->“index.template.html”文件中，在var params = {};語句下添加新語句：
        params.wmode = "opaque";

2、新建Tree右鍵菜單工具類:TreeRightClickManager.as

package com.th.rightClickManager
{
    import flash.display.InteractiveObject;
    import flash.events.ContextMenuEvent;
    import flash.events.MouseEvent;
    import flash.external.ExternalInterface;
    
    import mx.core.Application;
    import mx.core.FlexGlobals;
    
    public class TreeRightClickManager
    {
        static private var rightClickTarget:*;
        static public const RIGHT_CLICK:String = "rightClick";
        static private const javascript:XML = 
        <script>
            <![CDATA[
                function(flashObjectId)
                {                
                    var RightClick = {
                            init: function (flashObjectId) {
                            this.FlashObjectID = flashObjectId;
                            this.Cache = this.FlashObjectID;
                            if(window.addEventListener){
                                 window.addEventListener("mousedown", this.onGeckoMouse(), true);
                            } else {
                                document.getElementById(this.FlashObjectID).parentNode.onmouseup = function() { document.getElementById(RightClick.FlashObjectID).parentNode.releaseCapture(); }
                                document.oncontextmenu = function(){ if(window.event.srcElement.id == RightClick.FlashObjectID) { return false; } else { RightClick.Cache = "nan"; }}
                                document.getElementById(this.FlashObjectID).parentNode.onmousedown = RightClick.onIEMouse;
                            }
                        },
                        /**
                         * GECKO / WEBKIT event overkill
                         * @param {Object} eventObject
                         */
                        killEvents: function(eventObject) {
                            if(eventObject) {
                                if (eventObject.stopPropagation) eventObject.stopPropagation();
                                if (eventObject.preventDefault) eventObject.preventDefault();
                                if (eventObject.preventCapture) eventObject.preventCapture();
                                   if (eventObject.preventBubble) eventObject.preventBubble();
                            }
                        },
                        /**
                         * GECKO / WEBKIT call right click
                         * @param {Object} ev
                         */
                        onGeckoMouse: function(ev) {
                              return function(ev) {
                            if (ev.button != 0) {
                                RightClick.killEvents(ev);
                                if(ev.target.id == RightClick.FlashObjectID && RightClick.Cache == RightClick.FlashObjectID) {
                                    RightClick.call();
                                }
                                RightClick.Cache = ev.target.id;
                            }
                          }
                        },
                        /**
                         * IE call right click
                         * @param {Object} ev
                         */
                        onIEMouse: function() {
                              if (event.button > 1) {
                                if(window.event.srcElement.id == RightClick.FlashObjectID && RightClick.Cache == RightClick.FlashObjectID) {
                                    RightClick.call(); 
                                }
                                document.getElementById(RightClick.FlashObjectID).parentNode.setCapture();
                                if(window.event.srcElement.id)
                                RightClick.Cache = window.event.srcElement.id;
                            }
                        },
                        /**
                         * Main call to Flash External Interface
                         */
                        call: function() {
                            document.getElementById(this.FlashObjectID).rightClick();
                        }
                    }
                    
                    RightClick.init(flashObjectId);
                }
            ]]>
        </script>;

        public function TreeRightClickManager()
        {
            return;
        }

        static public function regist() : Boolean
        {
            if (ExternalInterface.available)
            {
                ExternalInterface.call(javascript, ExternalInterface.objectID);
                ExternalInterface.addCallback("rightClick", dispatchRightClickEvent);
                //Application.application.addEventListener(MouseEvent.MOUSE_OVER,mouseOverHandler);
                FlexGlobals.topLevelApplication.addEventListener(MouseEvent.MOUSE_OVER,mouseOverHandler);
            
            }
            return true;
        }

        static private function mouseOverHandler(event:MouseEvent) : void
        {
            rightClickTarget = InteractiveObject(event.target);  
            return;  
        }

        static private function dispatchRightClickEvent() : void
        {
            var event:ContextMenuEvent;
            if(rightClickTarget !=null)  
            {  
                event =new ContextMenuEvent(RIGHT_CLICK,true,false, rightClickTarget as InteractiveObject, rightClickTarget as InteractiveObject);  
                rightClickTarget.dispatchEvent(event);  
            }
            return;
        }

    }
}

3、Flex文件

<?xml version="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"
                initialize="init()">
    <fx:Script>
        <![CDATA[
            import com.th.rightClickManager.TreeRightClickManager;
            
            import mx.controls.Alert;
            import mx.controls.Menu;
            import mx.controls.listClasses.IListItemRenderer;
            import mx.events.MenuEvent;
            
        
            
            [Event(name="rightClick",type="flash.events.ContextMenuEvent")]
            
            //右鍵菜單圖標，現在沒用着，刪了也行
            [Embed("images/myIco.png")]
            private var menu_SP_add:Class;
            [Embed("images/myIco.png")]
            private var menu_TZ_add:Class;
            [Embed("images/myIco.png")]
            private var menu_Folder_add:Class;
            [Embed("images/myIco.png")]
            private var menu_FJ_uploadsingle:Class;
            
            
            private var rightClickRegisted:Boolean = false;
            private var menu:Menu;
            [Bindable]
            private var studetXml:XML;
            
            private function init():void{
                studetXml=
                    <nj label="一年級" id="n1" lx="0">
                        <bj label="1班" id="b1" lx="1">
                            <student label="劉備" id="s1" lx="2"/>
                             <student label="張飛" id="s2" lx="2"/>
                         <student label="關羽" id="s3" lx="2"/>
                         <student label="諸葛亮" id="s4" lx="2"/>
                        </bj>
                    </nj>;
                if (!rightClickRegisted){  
                    TreeRightClickManager.regist();  
                    rightClickRegisted = true;  
                } 
                //加載右擊事件
                studentTree.addEventListener(TreeRightClickManager.RIGHT_CLICK,treeRightClickHandler);
            }
            
            //樹右擊事件
            private function treeRightClickHandler(event:ContextMenuEvent):void
            {
                tree_onRightClicked(event); 
                tree_removeMenu();
                tree_InitMenu();
            }
            
            
            private function tree_onRightClicked(e:ContextMenuEvent):void 
            {  
                var rightClickItemRender:IListItemRenderer;    
                var rightClickIndex:int;  
                if(e.mouseTarget is IListItemRenderer)
                {          
                    rightClickItemRender = IListItemRenderer(e.mouseTarget);         }
                    
                else if(e.mouseTarget.parent is IListItemRenderer)
                {          
                    rightClickItemRender = IListItemRenderer(e.mouseTarget.parent);    
                }    
                if(rightClickItemRender != null)
                {    
                    rightClickIndex = studentTree.itemRendererToIndex(rightClickItemRender);    
                    if(studentTree.selectedIndex != rightClickIndex)
                    {    
                        studentTree.selectedIndex = rightClickIndex;   
                    }   
                } 
            }
            
            //刪除右鍵菜單
            private function tree_removeMenu():void 
            {  
                if(menu!=null)  
                {  
                    menu.hide();
                    menu.removeEventListener(MenuEvent.ITEM_CLICK,tree_MenuItemSelected);  
                    menu=null;  
                }  
            }
            
            //生成右鍵菜單
            private var selectedId:String="";
            private var selectedLabel:String="";
            private function tree_InitMenu():void
            {
                var currentItem:XML=studentTree.selectedItem as XML;
                selectedId=currentItem.@id;
                selectedLabel=currentItem.@label;
                var lx:String=currentItem.@lx;
                
                menu = Menu.createMenu(this, tree_createMenuItems(lx), false);
                menu.iconField="itemIcon";//右鍵菜單的圖標
                menu.labelField="label";  //右鍵菜單的名稱 
                menu.variableRowHeight = true;     
                menu.addEventListener(MenuEvent.ITEM_CLICK, tree_MenuItemSelected);  //右鍵菜單的事件
                var point:Point = new Point(mouseX,mouseY);  
                point = localToGlobal(point);   
                menu.show(point.x,point.y);  //顯示右鍵菜單
            }
            
            
            //根據節點不同，生成不同的菜單
            private function tree_createMenuItems(lx:String):Array  
                
            {  
                var menuItems:Array = new Array();
                var menuXs:Object= new Object;  
                menuXs.label = '刷新';
                //menuXs.itemIcon = this.menu_TZ_add;  //給菜單加圖標
                menuItems.push(menuXs);
                var menuExpand:Object=new Object();
                menuExpand.label="展開當前節點";
                menuItems.push(menuExpand);
                var menuClose:Object=new Object();
                menuClose.label="關閉當前節點";
                menuItems.push(menuClose);
                var menuExpandAll:Object=new Object();
                menuExpandAll.label="展開所有節點";
                menuItems.push(menuExpandAll);
                var menuCloseAll:Object=new Object();
                menuCloseAll.label="關閉所有節點";
                menuItems.push(menuCloseAll);
                switch(lx){
                    case "0":
                        var menuAddNj:Object = new Object;  
                        menuAddNj.label = "添加年級";
                        menuItems.push(menuAddNj);
                        var menuDelNj:Object=new Object();
                        menuDelNj.label="刪除年級";
                        menuItems.push(menuDelNj);
                        break;
                    case "1":
                        var menuAddBj:Object=new Object();
                        menuAddBj.label="添加班級";
                        menuItems.push(menuAddBj);
                        var menuDelBj:Object=new Object();
                        menuDelBj.label="刪除班級";
                        menuItems.push(menuDelBj);
                        var menuAddStu:Object=new Object();
                        menuAddStu.label="添加學生";
                        menuItems.push(menuAddStu);
                        break;
                    case "2":
                        var menuEditStu:Object=new Object();
                        menuEditStu.label="修改學生";
                        menuItems.push(menuEditStu);
                        var menuDelStu:Object=new Object();
                        menuDelStu.label="刪除學生";
                        menuItems.push(menuDelStu);
                        break;
                }            
                
                return menuItems;
                
            }
        
            //點擊菜單，相應方法 
            private function tree_MenuItemSelected(event:MenuEvent):void
                
            {
                var menuItem:Object = event.menu.selectedItem as Object;
                switch(menuItem.label)
                {
                    case "展開當前節點":
                        nodeExpand();
                        break;
                    case "關閉當前節點":
                        nodeClose();
                        break;
                    case "展開所有節點":
                        nodeExpandAll();
                        break;
                    case "關閉所有節點":
                        nodeCloseAll();
                        break;
                    case "刪除學生":
                        delStuNode();
                        break;
                    case "添加學生":
                        addStuNode();
                        break;
                        
                }
            }
            
            
            //改變事件
            private function treeChanged(event:Event):void{
                var selectedTreeNode:XML;
                selectedTreeNode=Tree(event.target).selectedItem as XML;
                Alert.show("您點擊了："+selectedTreeNode.@label,"提示");
    
            }
            
            //展開當前節點
            private function nodeExpand():void{  
                studentTree.expandItem(studentTree.selectedItem,true);  
            }
            
            //關閉當前節點
            private function nodeClose():void{  
                studentTree.expandItem(studentTree.selectedItem,false);

            } 
            
            //展開所有節點
            private function nodeExpandAll():void{
                for each(var item:XML in studentTree.dataProvider) {
                    studentTree.expandChildrenOf(item,true); 
                }
            }
            
            //關閉所有節點
            private function nodeCloseAll():void{
                //方法1：studentTree.openItems = [];
                //方法2：
                for each(var item:XML in studentTree.dataProvider) {
                    studentTree.expandChildrenOf(item,false);
                }
            }
            
            //刪除學生
            private function delStuNode():void{
                Alert.show("刪除學生 ID="+selectedId+"  名稱="+selectedLabel,"提示");
                var delStuItemPar:Object=new Object();
                delStuItemPar=studentTree.selectedItem.parent();
                var delStuInx:int=studentTree.selectedItem.childIndex();
                studentTree.dataDescriptor.removeChildAt(delStuItemPar,studentTree.selectedItem,delStuInx,studentTree.dataProvider);   
            }
            
            //添加學生
            private function addStuNode():void{
                var newStuXML:XML=<student label="新學生" id="s5" lx="2"/>;
                (studentTree.selectedItem as XML).appendChild(newStuXML); 
            }
            
        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- 將非可視元素（例如服務、值對象）放在此處 -->
    </fx:Declarations>
    <s:Panel x="25" y="23" width="250" height="448" title="學生">
        <mx:Tree id="studentTree" left="0" top="0" width="100%" height="100%" labelField="@label" 
                 change="treeChanged(event)" dataProvider="{studetXml}" allowMultipleSelection ="true"/>
    </s:Panel>
</s:Application>

4、效果圖：