Scenario Description:Click an image to respond to the event. You must listen to events and process events in.
1. A Custom Event is as follows:
Copy codeThe Code is 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 to event processing is AS follows:Copy codeThe Code is as follows: package handler
{
Import bridge. MyEvent;
Import flash. events. Event;
Import mx. controls. Alert;
Import skin. imghandskin;
Import spark. components. BorderContainer;
Import spark. components. Image;
Public class ImgHander extends BorderContainer
{
[SkinPart (required = "true")]
Public var img: Image; // The Open button.
Public function ImgHander ()
{
Super ();
This. setStyle ("skinClass", imghandskin );
This. percentHeight = 100;
This. percentWidth = 100;
}
// Initialize the listener
Override public function initialize (): void {
Super. initialize ();
Img. addEventListener (MyEvent. myclick, SetImgShouZhanUrl );
}
Private function SetImgShouZhanUrl (event: Event): void {
Alert. show ("Preview ");
}
}
}
3. Create a New MXML appearance and skin class. Send custom events here. (There is an image in the assert Folder: Conan .jpg) as follows:Copy codeThe Code is as follows: <? Xml version = "1.0" encoding = "UTF-8"?>
<! --
Adobe systems inconfigurated
Copyright 2008 Adobe Systems inconfigurated
All Rights Reserved.
NOTICE: Adobe permits you to use, 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 here so that changes to the host component's
Size will not be thwarted by this skin part's 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. Create an MXML application to call the AS class. Run directly.Copy codeThe Code is 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. *">
<Handler: ImgHander>
</Handler: ImgHander>
</S: Application>
End!
Note:
1. Send custom events:Copy codeThe Code is as follows: var e: MyEvent = new MyEvent (MyEvent. myclick );
Img. dispatchEvent (e );
2. receive and handle events:
Img. addEventListener (MyEvent. myclick, SetImgShouZhanUrl );