Flex学习笔记（八）——事件（event）

最新推荐文章于 2020-11-17 15:31:54 发布

爪哇天河

最新推荐文章于 2020-11-17 15:31:54 发布

阅读量1.5k

点赞数

分类专栏： flex 文章标签： flex Event

本文链接：https://blog.csdn.net/ps_zhanglei/article/details/41281649

版权

flex 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

1、鼠标事件：

<?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" initialize="iniApp()">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import flash.events.MouseEvent;		
			import flash.events.EventDispatcher;	
			import com.events.NewEvent;
			
			
			internal function iniApp():void
			{
				
				/**
				//按钮1 鼠标点击
				btn1.addEventListener(MouseEvent.CLICK,onClick);		
				//画布1 鼠标经过
				cav1.addEventListener(MouseEvent.MOUSE_OVER,onMOver);
				//按钮1鼠标点击 去掉画布1的鼠标经过事件
				btn1.addEventListener(MouseEvent.CLICK,onRemove);
				*/
				
				/**
				//查看当前组件的属性
				cav1.addEventListener(MouseEvent.CLICK,onPress);
				cav2.addEventListener(MouseEvent.CLICK,onPress);
				btn2.addEventListener(MouseEvent.CLICK,onPress);
				*/
				
				btn2.addEventListener(MouseEvent.CLICK,onCk1,false,8);
				btn2.addEventListener(MouseEvent.CLICK,onCk2,false,1);
				btn2.addEventListener(MouseEvent.CLICK,onCk3,false,15);
				
				
			}
			
			internal function onClick(evt:MouseEvent):void
			{
				Alert.show("你点击了一下按钮","提示");										
			}
			
			internal function onMOver(evt:MouseEvent):void
			{										
				
				debug("鼠标经过画板");
				
			}	
			
			internal function onPress(evt:MouseEvent):void
			{
				evt.stopImmediatePropagation();
				//evt.stopPropagation();	
				//evt.preventDefault();				
				
				debug("是否冒泡："+evt.bubbles);
				debug("目标对象："+evt.target);
				debug("所处阶段："+evt.eventPhase);
				debug("当前对象："+evt.currentTarget);
				debug("---------");		
				
			}
			
			internal function onCk1(evt:MouseEvent):void
			{
				debug("ck1");										
			}
			
			internal function onCk2(evt:MouseEvent):void
			{
				debug("ck2");										
			}
			
			internal function onCk3(evt:MouseEvent):void
			{
				debug("ck3");										
			}			
			
			internal function onRemove(evt:MouseEvent):void
			{
				cav1.removeEventListener(MouseEvent.MOUSE_OVER,onMOver);										
			}				
			
			internal function debug(msg:String):void{
				txt.text+=msg+"\n";				
			}		
		]]>
	</fx:Script>
	
	<mx:Button x="63" y="33" label="点击我" fontSize="12" id="btn1" width="140"/>
	<mx:Canvas x="288" y="10" width="306" height="116" backgroundAlpha="1.0" backgroundColor="#ABF99B" label="画布" id="cav1">
		<mx:Canvas x="39" y="25" width="213" height="69" backgroundColor="#FA270B" id="cav2">
			<mx:Button x="67" y="23" label="按钮2" id="btn2" fontSize="12" width="92" height="31"/>
		</mx:Canvas>
	</mx:Canvas>
	<mx:TextArea x="22" y="179" width="563" height="193" id="txt" fontSize="12"/>
	<mx:TextArea x="22" y="82" width="181" height="89" fontSize="12" text="1-捕获阶段
2-目标阶段
3-冒泡阶段
"/>
</s:Application>

2、事件注册及执行顺序：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
	creationComplete="init()">

	<mx:Script>
		<![CDATA[
			
			import mx.controls.Alert;
			
			internal function init():void{
				cav.addEventListener("testEvent",onShow);
				btn.addEventListener("testEvent",onShow);
				btn.addEventListener(MouseEvent.CLICK,onClick);
				trace("1:addEventlistener");
			}
			
			internal function onClick(evt:MouseEvent):void{
				Alert.show("bbb","sbbb");		
				if(evt.currentTarget==evt.target){
					trace("2:dispatchEvent!");
					btn.dispatchEvent(new Event("testEvent",true,false));	
					trace(this.toString());
				}				
			}
			
			public function onShow(evt:Event):void{
				trace("3:onShow "+evt.type);
				
				if (evt.currentTarget==evt.target){
					Alert.show("触发了"+evt.currentTarget+"注册的："+evt.type+"事件");
				}
			}
		]]>
	</mx:Script>


	<mx:Canvas x="40" y="30" width="472" height="284" borderColor="#8317AB" 
		backgroundColor="#B246E9" id="cav" >
		<mx:Button x="332" y="53" label="Button" id="btn" />
	</mx:Canvas>
	
</mx:Application>

3、自定义事件：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
	creationComplete="init()">

	<mx:Script>
		<![CDATA[
			
			import com.events.NewEvent;
			import mx.controls.Alert;
			
			internal function init():void{
				cav.addEventListener(NewEvent.NEWCLICK,onShow);
				btn.addEventListener(MouseEvent.CLICK,onclick);
				trace("1:addEventlistener");
			}
			
			internal function onclick(evt:MouseEvent):void{
				//Alert.show("bbb","sbbb");		
				//if(evt.currentTarget==evt.target){
					trace("2:dispatchEvent!");
					cav.dispatchEvent(new NewEvent(NewEvent.NEWCLICK,"China"));									
				//}				
			}
			
			public function onShow(evt:NewEvent):void{
				trace("3:onShow "+evt.type);
				Alert.show("触发了cav注册的："+evt.type+"事件,通过事件对象传递的数据是："+evt.data);
			}
		]]>
	</mx:Script>


	<mx:Canvas x="40" y="30" width="254" height="284" borderColor="#8317AB" 
		backgroundColor="#B246E9" id="cav" >
	</mx:Canvas>
	<mx:Button x="332" y="53" label="Button" id="btn" />
	
</mx:Application>

NewEvent.as

package com.events
{
	import flash.events.Event;

	public class NewEvent extends Event
	{
		
		public static const NEWCLICK:String="newevent";
		
		public var data:String;
		
		
		public function NewEvent(type:String,data:String)
		{
			this.data=data;
			super(type, false, false);
		}
		
	}
}

4、组件方法时间绑定：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="*">

	<mx:Script>
		<![CDATA[
			
			import mx.controls.Alert;
			import com.events.loginformEvent;
			
			internal function login(evt:loginformEvent):void
			{
				if ((evt.name=="zhangsan") && (evt.password=="123")){
					Alert.show("你已经成功登录！","提示");
				} 
				else
				{
					Alert.show("输入信息有误！","提示");
				}
							
			}
			
//			init(){
//				loginform.addEventListener("loginEven",login);
//			}
		]]>
	</mx:Script>
	
	<ns1:LoginForm x="70.5" y="29" id="loginform" loginEvent="login(event)">
	</ns1:LoginForm>
	
</mx:Application>

loginformEvent.as

package com.events
{
	import flash.events.Event;

	public class loginformEvent extends Event
	{
		public var name:String="";
		public var password:String="";
		
		public function loginformEvent(type:String)
		{
			super(type, false, false);
		}
		
	}
}

LoginForm.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="348" height="200" borderColor="#3CD5E3" title="登录表单" fontSize="12" fontWeight="bold">
	<mx:Metadata>
		[Event(name="loginEvent",type="com.events.loginformEvent")]
		//[Event(name="loginEvent2", type="flash.events.Event")]
	</mx:Metadata>
	
	<mx:Script>
		<![CDATA[
			import com.events.loginformEvent;
			
			internal function onClick(evt:MouseEvent):void{
				var e:loginformEvent=new loginformEvent("loginEvent");
				e.name=txt_name.text;
				e.password=txt_pwd.text;
				
				dispatchEvent(e);
			}
			
		]]>
	</mx:Script>
	
	<mx:Label x="42" y="33" text="用户名：" height="22" fontSize="12" fontWeight="bold"/>
	<mx:Label x="42" y="76" text="密码：" fontSize="12" fontWeight="bold"/>
	<mx:TextInput x="110" y="33" id="txt_name"/>
	<mx:TextInput x="110" y="74" id="txt_pwd" displayAsPassword="true"/>
	<mx:Button x="110" y="114" label="登录" id="btn_login" fontSize="12" 
		fontWeight="bold" width="69" click="onClick(event)"/>
	
</mx:Panel>

运行结果：

爪哇天河

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Flex学习笔记（八）——事件（event）

1、鼠标事件：<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" ini
复制链接

扫一扫