教你7步实现flex自定义Event及参数传递

1、教你7步实现flex自定义Event及参数传递Flex应用开发过程中如需要灵活的在不同组件（如A与B，父与子）之间响应事件，传递参数等功能时就会使用自定义事件（Event）机制,下面通过一个事例分七步,通过自定义Event和EventDispatcher两种机制实现事件交互和参数传递;        事例描述:有一个父亲“parentApp.mxml”有两个儿子“comBrotherA.mxml”和"comBrotherB.mxml",新年 降至，两个儿子为表孝心分别给他们老爸存入(事件)一笔过节费(事件

2、参数),并通知老爸我存钱进去了，老爸在收到两个儿子的钱后汇总后同时告诉(事件)两 个儿子钱我已收到总数(事件参数)是多少.    1、第一步：引入自定义注册事件参数传递扩展类(来自网络)   view plaincopy to clipboardprint?1. package myeventhelper  2.   3.     /自定义注册事件参数传递扩展类  4.     publ

3、ic class EventArgExtend  5.       6.         public function EventArgExtend()  7.           8.        

4、60;  9.         public static function create(f:Function,.arg):Function /动态参数创建  10.           11.             

5、;var F:Boolean = false;  12.             var _f:Function = function(e:*,._arg)  13.               14.    

6、             _arg = arg;  15.                 if(!F)  16.            &

7、#160;      17.                     F = true;  18.                 

8、0;   _arg.unshift(e);  19.                   20.                 f.apply(null,_arg);  21.  

9、;             22.             return _f;  23.           24.         pu

10、blic static function toString():String  25.           推荐精选26.             return "Class JEventDelegate"  27.     &#

11、160;     28.       29.       2、第二步：自定义事件触发类：view plaincopy to clipboardprint?1. package myeventhelper  2.   3.     import flash.events.EventDispatcher;  4. 

12、0;    5.     import mx.core.UIComponent;  6.     /自定义事件触发类  7.     public class MyEventDispatcher extends EventDispatcher  8.       9.

13、        private static var _instance:MyEventDispatcher;  10.         public static const EXEC_PARENT_METHOD:String="ExecParentMethod" /执行Parent方法  11. 

14、0;       public static function getInstance():MyEventDispatcher  12.           13.            if(_instance=null)  14.  &

15、#160;            _instance=new MyEventDispatcher();  15.              16.            return _instanc

16、e;  17.           18.         public var Source:UIComponent; /事件源对象  19.         public var Parsms:Object; /主要用于参数传递

17、0; 20.       21.   推荐精选    3、第三步：用户自定义事件类    view plaincopy to clipboardprint?1. package myeventhelper  2.       3.         import mx.e

18、vents.FlexEvent;  4.         /用户自定义事件类  5.         public class MyExtendEvent extends FlexEvent  6.           7.  &

19、#160;          public static const EXEC_BROTHER_METHOD:String="ExecBrotherMethod"/执行兄弟方法  8.              9.        

20、;     public var param:Object;  10.             public function MyExtendEvent(o:Object,type:String, bubbles:Boolean=false, cancelable:Boolean=false)  11.   

21、;            12.                 super(type, bubbles, cancelable);  13.            &#

22、160;    this.param = o;/也可通过这样的方式传递参数  14.               15.           16.       推荐精选    4、第四步：

23、完成儿子A“comBrotherA.mxml”：    view plaincopy to clipboardprint?1. <?xml version="1.0" encoding="utf-8"?>  2.     <mx:Panel xmlns:mx="3.     <mx:Script>  4.   

24、0;     <!-CDATA  5.             import myeventhelper.MyExtendEvent;  6.             import myeventhelper.MyEventDispatcher

25、;  7.             import myeventhelper.EventArgExtend;  8.             private var execParent:MyEventDispatcher; /触发父亲节点事件  9.

26、60;           function init():void  10.               11.                 execPa

27、rent = MyEventDispatcher.getInstance();  12.               13.             public function onGetParentTotal(e:MyExtendEvent,.agrs):void 

28、; 14.               15.                 /下面两种方法都可以用来传递参数  16.             &

29、#160;   /this.labTotal.text = String(agrs0.totalValue);  17.                 this.labTotal.text = e.param.toString();  18.        

30、       19.             public function onParentEvent(event:Event):void  20.               21.    

31、60;            execParent.Parsms = txtValue.text;  22.                 execParent.Source = this;  23.    

32、             execParent.dispatchEvent(new Event(MyEventDispatcher.EXEC_PARENT_METHOD);  24.               推荐精选25.       

33、       26.         ->  27.     </mx:Script>  28.         <mx:Canvas height="90" width="197"> &#

34、160;29.         <mx:TextInput width="92" y="10" x="85" id="txtValue"/>     30.         <mx:Label x="13" y=

35、"12" text="存入："/>  31.         <mx:Label x="87" y="56" width="90" id="labTotal"/>  32.         <mx:Labe

36、l x="5" y="56" text="ParentTotal:"/>  33.         </mx:Canvas>  34.         <mx:ControlBar>  35.      

37、60;      <mx:Button label="调用父方法" id="btnExecParent" click="onParentEvent(event)"/>  36.         </mx:ControlBar>  37.     </mx:Pa

38、nel>      5、第五步：完成儿子B“comBrotherB.mxml”：    view plaincopy to clipboardprint?1. <?xml version="1.0" encoding="utf-8"?>  2.     <mx:Panel xmlns:mx="3.     <

39、mx:Script>  4.         <!-CDATA  5.             import myeventhelper.MyExtendEvent;  6.             

40、;import myeventhelper.MyEventDispatcher;  7.             import myeventhelper.EventArgExtend;  8.              9.      &

41、#160;      private var execParent:MyEventDispatcher; /触发父亲节点事件  10.             function init():void  推荐精选11.           

42、    12.                 execParent = MyEventDispatcher.getInstance();  13.               14.    

43、;         public function onGetParentTotal(e:Event,.agrs):void /响应父亲类的触发的事件  15.               16.           &

44、#160;     this.labTotal.text = String(agrs0.totalValue);  17.               18.              19.     

45、;        public function onParentEvent(event:Event):void /通过自定义事件触发类传递参数  20.               21.            

46、60;    execParent.Parsms = txtValue.text;  22.                 execParent.Source = this;  23.            

47、     execParent.dispatchEvent(new Event(MyEventDispatcher.EXEC_PARENT_METHOD);  24.               25.         ->  26.    &

48、#160;</mx:Script>  27.         <mx:Canvas height="90" width="197">  28.         <mx:TextInput width="92" y="10" x="

49、85" id="txtValue"/>     29.         <mx:Label x="13" y="12" text="存入："/>  30.         <mx:Label x="

50、;87" y="56" width="90" id="labTotal"/>  31.         <mx:Label x="5" y="56" text="ParentTotal:"/>  32.      

51、0;  </mx:Canvas>  33.         <mx:ControlBar>  34.             <mx:Button label="调用父方法" id="btnExecParent" click="o

52、nParentEvent(event)"/>  35.         </mx:ControlBar>  36.     </mx:Panel>  推荐精选    6、第六步：完成父亲类"parentApp.mxml":    view plaincopy to clipboardprint?1.

53、 <?xml version="1.0" encoding="utf-8"?>  2.     <mx:Application xmlns:mx="3.     <mx:Script>  4.         <!-CDATA  5.   &#

54、160;         import myeventhelper.MyExtendEvent;  6.             import myeventhelper.MyEventDispatcher;  7.          &#

55、160;  import myeventhelper.EventArgExtend;  8.             private var parentDP:MyEventDispatcher;  9.             public var 

56、;totalValue:Number = 0;  10.             function init():void  11.               12.         &#

57、160;       parentDP = MyEventDispatcher.getInstance();  13.                 nodeEvent = new MyExtendEvent(totalValue,MyExtendEvent.EXEC_BROTHER_METHOD

58、);  14.                  15.                 if(!parentDP.hasEventListener(MyEventDispatcher.EXEC_PARENT_METHOD)  1

59、6.                     parentDP.addEventListener(MyEventDispatcher.EXEC_PARENT_METHOD,getSonValue);/注册通过自定义事件触发类传递参数  17.            &#

60、160;         18.                 /注册事件时传递参数  19.                 addEventListener(MyE

61、xtendEvent.EXEC_BROTHER_METHOD,EventArgExtend.create(comA.onGetParentTotal,this);  推荐精选20.                 addEventListener(MyExtendEvent.EXEC_BROTHER_METHOD,EventArgExtend.create(comB.onGetParentTotal,this);&#

62、160; 21.               22.             function getSonValue(e:Event):void  23.             

63、;  24.                 if(parentDP.Source = comA)  25.                   26.     

64、;                txtA.text = String(parentDP.Parsms);  27.                   28.      

65、;           else  29.                   30.                  

66、;   txtB.text = String(parentDP.Parsms);  31.                   32.               33.    &

67、#160;         34.             /将结果返回儿子节点  35.             private var nodeEvent:MyExtendEvent;  36.  

68、;           function onSumToNode(e:Event):void/触发事件将结果返回儿子节点  37.               38.             

69、0;   totalValue = Number(txtA.text) + Number(txtB.text);  39.                 txtTotal.text = String(totalValue);  40.       

70、          nodeEvent.param = totalValue;  41.                 dispatchEvent(nodeEvent);  42.