FLEX 事件机制-自定义事件

最近在做地图JS和FLEX的封装工作,flex封装需要用到自定义事件这方面知识,在这里就简单介绍一下FLEX自定义事件。

自定义事件必须注意几点:

        1)自定义事件通过继承Event类来实现。

        2)自定义事件不可以自己触发,只能有系统事件派发。

首先我们新建一个ActionScript 类,这个继承flash.events.Event     

package  
{
	import flash.events.Event;

	public class MyEvent extends Event
	{
		public static const myEvent:String="myEvent";
		
		public var data:*;
		
		public function MyEvent(type:String,bubbles:Boolean=false,cancellabel:Boolean=false,data:* = null)
		{
			super(type,false,false);
			this.data = data;
		}
		
		override public function clone():Event{
			return new MyEvent(myEvent,false,false,data);
		}
		
		override public function toString():String{
			
			return formatToString("MyEvent");
		} 
	}
}

创建一个组件来监听事件,实现数据的接受

component.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Group 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="100%" height="100%" initialize="init()">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>
	
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.FlexEvent;	
			public var ff:FlexMyEvent;
			
		public function init():void{
		
			 ff = this.parentDocument as FlexMyEvent;
			 ff.addEventListener(MyEvent.myEvent,myEventHandler);//监听事件
		
		}
		public function myEventHandler(eve:Object):void{
			 
			inpu.text = eve.data;
			 Alert.show("事件触发,"+eve.data); 
		}
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	
	
	<s:Panel width="100%" height="100%" backgroundColor="#E7D4DD">
		
		 <s:TextInput id="inpu">
			 
		 </s:TextInput>
		
	</s:Panel>
	
	
	
</s:Group>

主程序

FlexMyEvent.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:comp = "*"  
			   width="100%" height="100%">
	
	<fx:Script>
		<![CDATA[
			
			import flash.external.ExternalInterface;
			import flash.system.Security;
			
			import mx.controls.Alert;
			import mx.events.FlexEvent; 
			public var callBackInfo:String = "";
			public function doSend():void{
				
				callBackInfo = input.text;
				var myEve:MyEvent = new MyEvent(MyEvent.myEvent,false,false,callBackInfo);//派发事件				         myEve.data is Object;  
				this.dispatchEvent(myEve);
			
			}
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	
	<mx:HBox  width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
		
	
		<s:Panel width="100%" height="100%">
			<mx:HBox  paddingLeft="5" width="100%" height="100%">
				<s:TextInput  id="input" text="Send Hello">
					
				</s:TextInput>
				<s:Button label="Send" click="doSend()">
					
				</s:Button>
			</mx:HBox>
		</s:Panel>
	
	 <comp:Component>
		 
	 </comp:Component>
	</mx:HBox>
	
</s:Application>




 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值