自定义事件

 如果要自定义事件通常要做三件事：

1. 自定义Event类，一般都是继承 flash.events.Event
2. 利用Event metadata标签声明事件
3. 分发事件。

前面两项都比较容易做到，关键是怎么分发事件。在Flex Builder的联机帮助关于自定义Component中讲到直接利用dispatchEvent方法。因为通常自定义Component都是从Flex自带的控件开始继承下来的，而这些控件都有该方法。自然就容易做到分发事件。但是对于我自己定义一个类，这个类并不是一个Component，那该如何分发时间呢？如自己写一个DataProvider，它负责从Server端取数据（在Flex中都是异步获取服务器数据，所以必须通过事件回调的方式来告知DataGrid，当然你会说用Bindable好了，实际上它也是以事件的形式做到的），成功之后以事件的形式通知DataGrid。

 

仔细看一下flex里面的Component，基本上都是从DisplayObject继承下来的，而这个直接继承了EventDispatcher类——它就提供了dispatchEvent方法。所以关键在于继承EventDispatcher类，这样就可以直接调用dispatchEvent方法来分发事件了。不过可惜的是有的时候你的类已经继承其它类了，而基类并没有继承EventDispatcher，这个时候你只能另想其它的办法了（AS跟java一样是单继承的）。这个办法其实也很简单，你参考一下Flex中ListCollectionView的实现就知道了。它实现了IEventDispatcher接口，因为EventDispatcher也是实现这个接口了。它是如何实现这个接口的呢？很简单，他就是new了一个EventDispatcher成员变量，然后所有接口都直接调用这个成员变量相应的方法来实现。这就是所谓的适配器模式吧。具体可以参考后面的代码：

 

实现IEventDispatcher来实现事件分发

package { import flash.events.Event; import flash.events.EventDispatcher; import flash.events.IEventDispatcher; [Event("ColumnTestEvent", "ColumnEvent")] public class Column implements IEventDispatcher //extends EventDispatcher { private var eventDispatcher : EventDispatcher; private static var i : int = 0; public var col1 : String; public var col2 : String; public var col3 : String; public function Column() { eventDispatcher= new EventDispatcher(this); i++; col1 = "col1_" + i; col2 = "col2_" + i; col3 = "col3_" + i; } public function toString():String{ return col1 + "; " + col2 + "; " + col3; } public function testEvent():void{ var evt : ColumnEvent = new ColumnEvent("ColumnTestEvent"); dispatchEvent(evt); } public function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void { eventDispatcher.addEventListener(type, listener, useCapture, priority, useWeakReference); } public function dispatchEvent(event:Event):Boolean { return eventDispatcher.dispatchEvent(event); } public function hasEventListener(type:String):Boolean { return eventDispatcher.hasEventListener(type); } public function removeEventListener(type:String, listener:Function, useCapture:Boolean = false):void { eventDispatcher.removeEventListener(type, listener, useCapture); } public function willTrigger(type:String):Boolean { return eventDispatcher.willTrigger(type); } } }

 

继承EventDispatcher实现事件分发

package { import flash.events.Event; import flash.events.EventDispatcher; import flash.events.IEventDispatcher; [Event("ColumnTestEvent", "ColumnEvent")] public class Column extends EventDispatcher { private static var i : int = 0; public var col1 : String; public var col2 : String; public var col3 : String; public function Column() { eventDispatcher= new EventDispatcher(this); i++; col1 = "col1_" + i; col2 = "col2_" + i; col3 = "col3_" + i; } public function toString():String{ return col1 + "; " + col2 + "; " + col3; } public function testEvent():void{ var evt : ColumnEvent = new ColumnEvent("ColumnTestEvent"); dispatchEvent(evt); } } }

 

自定义的事件类ColumnEvent

package { import flash.events.Event; public class ColumnEvent extends Event { public function ColumnEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false) { super(type, bubbles, cancelable); } } }

 

Application

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="init()" xmlns:mycontrols="mycontrols.*"> <mx:Script> <!--[CDATA[ import mx.controls.Alert; import mx.messaging.AbstractConsumer; import mx.collections.ArrayCollection; import mx.charts.ColumnChart; [Bindable] private var arrayCollection : ArrayCollection; private function init() : void{ var array : Array = new Array(); for(var i:int = 0; i<3; i++){ array[i] = getColumn(); } arrayCollection = new ArrayCollection(array); } private function getColumn():Column{ var column : Column = new Column(); column.addEventListener("ColumnTestEvent", function(event:Event):void{ Alert.show("column = " + event.target, "Column"); }); return column; } function changeDP(event:Event):void{ var column :Column = getColumn(); column.testEvent(); arrayCollection.addItem(column); } ]]--> </mx:Script> <mx:DataGrid x="37" y="21" dataProvider="{arrayCollection}" alternatingItemColors="[#FFFFFF,#CCCCCC,#999999]"> <mx:columns> <mx:DataGridColumn headerText="Column 1" dataField="col1"/> <mx:DataGridColumn headerText="Column 2" dataField="col2"/> <mx:DataGridColumn headerText="Column 3" dataField="col3"/> </mx:columns> </mx:DataGrid> <mx:Button click="changeDP(event)" label="Click"/> </mx:Application>