自定义事件

??????? Flex开发者离不开两件事：组件和事件。可以说，Flex开发就是基于组件的事件驱动编程，事件不仅能够帮助开发者响应用户操作、完成应用任务，更重要的是可以使开发者设计出松散耦合的Flex应用架构。和vb差不多，事件驱动模型是Flex开发的核心。

??????? 对于事件模型，我们可以用Flex架构为我们提供的事件，但更加灵活的是，我们可以自定义事件。这就为灵活开发提供了可能。与public属性类似，方法并不是应用架构的最佳实践。公共属性和方法使得组件代码的重用性降低。事件是组件间通讯的最佳信使。

通过自定义事件和自定义组件，Flex开发者能够设计出松散耦合的应用架构。

1.使用ActionScript定义自定义事件

??? 自定义事件只是一个“特别”的ActionScript类。开发者创建自定义事件无外乎完成如下几个任务：继承flash.events.Event、定义事件属性、编写类构造器、重载clone方法。

????? 1）继承flash.events.Event类。

????? 2）定义事件属性：从某种程度上来说，事件就是系统传递的“消息”。Flash Player利用事件对象从事件目标向事件监听器传递数据。在自定义事件中，通过定义属性，

???? 可以让事件携带更多的信息。

????? 3）编写类构造器：类离不开构造器，事件类的构造器要完成两项任务：调用Super()，设置属性。

????? 4）重载clone方法：创建自定义事件的最后一步是重载父类的clone方法，返回新的Event对象。当触发事件时，即dispatchEvent(event)时，EventDispatcher会自动调用clone方法获取新的event对象。

2.使用元数据[Event]定义事件

??? 使用MXML标签注册事件侦听器。

???? 如何让组件认识自定义的事件：通过[Event]元数据，开发者可以为组件定义事件。编译器能够把这些自定义的事件识别为MXML标签属性。使用[Event]既可以为ActionScript组件定义事件，也可以为MXML组件定义事件。

 [Event(name="SwitchLightEvent",type="events.SwitchLightEvent")]

3.触发事件

?? 使用dispatchEvent()方法触发事件。由于我们的自定义组件继承自（或间接继承自）EventDispatcher类，因此获得了触发事件的能力。dispatchEvent接受Event事件对象作为参数，也意味着在触发事件前，我们要创建事件对象的实例，而dispatchEvent方法把该事件对象调度到事件流中。

 private function clickEventHandler(varSelectedLight:String):void{

var evtObj:SwitchLightEvent=new SwitchLightEvent("SwitchLightEvent",varSelectedLight);

dispatchEvent(evtObj);

}

?4.创建事件监听器?

通过dispatchEvent方法触发事件后，Flash Player会在事件流中检查显示列表中的每个节点对象是否注册了

?? 事件侦听器。事件侦听器最终将完成对事件的响应处理。

?

例子：

Lights.mxml组件

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="300" height="30"

   horizontalCenter="center" creationComplete="init()">

<mx:Script>

<![CDATA[

[Bindable]

public var currentLight:String;

 

private function init():void{

currentLight="关闭";

}

]]>

</mx:Script>

<mx:Label id="lblLightInfo" x="12" y="4"

  horizontalCenter="0" textAlign="center" fontSize="16"

  text="{currentLight}"/>        

 

</mx:Canvas>

LightConsole.mxml组件

?

<?xml version="1.0" encoding="utf-8"?>

<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 

 xmlns:s="library://ns.adobe.com/flex/spark" 

 xmlns:mx="library://ns.adobe.com/flex/mx" width="236" height="22">

<fx:Declarations>

<!-- 将非可视元素（例如服务、值对象）放在此处 -->

</fx:Declarations>

<fx:Metadata>

[Event(name="SwitchLightEvent",type="events.SwitchLightEvent")]

</fx:Metadata>

 

<fx:Script>

<![CDATA[

import events.SwitchLightEvent;

 

private function clickEventHandler(varSelectedLight:String):void{

var evtObj:SwitchLightEvent=new SwitchLightEvent("SwitchLightEvent",varSelectedLight);

dispatchEvent(evtObj);

}

]]>

</fx:Script>

<s:Button label="绿色" click="clickEventHandler('green')"/>

<s:Button label="红色" click="clickEventHandler('red')"/>

<s:Button label="黄色" click="clickEventHandler('yellow')"/>

</mx:HBox>

 

SwitchLightEvent类：

package events

{

import flash.events.Event;

 

public class SwitchLightEvent extends Event

{

private var selectedLight:String;

 

public function SwitchLightEvent(varType:String,varLight:String)

{

super(varType);

this.selectedLight=varLight;

}

 

override public function clone():Event{

return new SwitchLightEvent(type,selectedLight);

}

 

public function getSelectedLight():String{

return this.selectedLight;

}

}

}

?

CustomTrafficLightTest.mxml应用程序

<?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"

   xmlns:views="views.*"

   minWidth="955" minHeight="600">

<fx:Declarations>

<!-- 将非可视元素（例如服务、值对象）放在此处 -->

</fx:Declarations>

<fx:Script>

<![CDATA[

import events.SwitchLightEvent;

 

[Bindable]

private var selectedLight:String;

 

private function switchEventHandler(event:SwitchLightEvent):void{

selectedLight=String(event.getSelectedLight());

}

]]>

</fx:Script>

<views:LightConsole x="158" y="124" SwitchLightEvent="switchEventHandler(event)"/>

<views:Lights x="148" y="65" width="246" currentLight="{selectedLight}"/>

</s:Application>