Listen for custom events and handle instance code for events in as _flex

Scenario Description:Click on a picture to respond to the event. In as, you must listen to the event and handle the event.
1 Custom an event, as follows:

Copy Code code as follows:

Package Bridge {
Import flash.events.Event;
Import mx.events.FlexEvent;
public class MyEvent extends Event {
public static const myclick:string= "Myclick";
Public Function MyEvent (type:string, Bubbles:boolean=false, Cancelable:boolean=false)
{
Super (Type, bubbles, cancelable);
}
}
}

2 The As class that listens for event processing, as follows:

Copy Code code as follows:

Package Handler
{
Import Bridge. MyEvent;
Import flash.events.Event;
Import Mx.controls.Alert;
Import skin. Imghanderskin;
Import Spark.components.BorderContainer;
Import Spark.components.Image;
public class Imghander extends Bordercontainer
{
[Skinpart (required= "true")]
public var img:image;//Open button
Public Function Imghander ()
{
Super ();
This.setstyle ("Skinclass", Imghanderskin);
this.percentheight=100;
this.percentwidth=100;
}
Initializing listening
Override Public Function Initialize (): void{
Super.initialize ();
Img.addeventlistener (Myevent.myclick,setimgshouzhanurl);
}
Private Function Setimgshouzhanurl (event:event): void {
Alert.show ("Preview");
}
}
}

3 new Mxml skins, skin classes, where you send custom events. (There is a picture under the Assert folder: Conan. jpg) as follows:

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<!--
ADOBE SYSTEMS Incorporated
Copyright 2008 Adobe Systems Incorporated
All Rights Reserved.
Notice:adobe permits you, modify, and distribute this file
In accordance with the terms of the license agreement accompanying it.
-->
<!---The default skin class for a Spark skinnablecontainer container.
@see Spark.components.SkinnableContainer
@langversion 3.0
@playerversion Flash 10
@playerversion AIR 1.5
@productversion Flex 4
-->
<s:skin xmlns:fx= "http://ns.adobe.com/mxml/2009" xmlns:s= "Library://ns.adobe.com/flex/spark"
xmlns:fb= "http://ns.adobe.com/flashbuilder/2009" alpha.disabled= "0.5" >
<fx:metadata>[hostcomponent ("Spark.components.BorderContainer")]</fx:metadata>
<fx:script fb:purpose= "Styling" >
<! [cdata[
Import Bridge. MyEvent;
/**
* @private
*/
Override protected function Updatedisplaylist (Unscaledwidth:number, unscaledheight:number): void
{
Push BackgroundColor and Backgroundalpha directly.
Handle undefined backgroundcolor by hiding the background object.
if (isNaN (GetStyle ("BackgroundColor"))
{
Background.visible = false;
}
Else
{
Background.visible = true;
Bgfill.color = GetStyle ("BackgroundColor");
Bgfill.alpha = GetStyle ("Backgroundalpha");
}
Super.updatedisplaylist (Unscaledwidth, unscaledheight);
}
Private Function Img_mouseouthandler (event:mouseevent): void{
TODO auto-generated Method Stub
var e:myevent= new MyEvent (Myevent.myclick);
Img.dispatchevent (e);
}
]]>
</fx:Script>
<s:states>
<s:state name= "Normal"/>
<s:state name= "Disabled"/>
</s:states>
<!---defines the appearance of the Skinnablecontainer class ' s background. -->
<s:rect id= "Background" left= "0" right= "0" top= "0" bottom= "0" >
<s:fill>
<!---@private-->
<s:solidcolor id= "Bgfill" color= "#FFFFFF"/>
</s:fill>
</s:Rect>
<!--
Note:setting the minimum size to 0 this changes to the host component ' s
The size is not is thwarted by the skin part ' minimum size. This is a compromise,
More about it here:http://bugs.adobe.com/jira/browse/sdk-21143
-->
<!---@copy Spark.components.skinnablecontainer#contentgroup-->
<s:group id= "Contentgroup" left= "0" right= "0" top= "0" bottom= "0" minwidth= "0" minheight= "0" >
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:image id= "img" click= "Img_mouseouthandler (event)" Source= "assert/Conan. jpg" >
</s:Image>
</s:Group>
</s:Skin>

4 Finally, create a mxml application inside, to invoke the As class. Run directly.

Copy Code code as follows:

<?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"
Xmlns:handler= "Handler.*" >
</s:Application>

End!
Note:
1 To send custom events:

Copy Code code as follows:

var e:myevent= new MyEvent (Myevent.myclick);
Img.dispatchevent (e);

2 Receive and Process events:
Img.addeventlistener (Myevent.myclick,setimgshouzhanurl);