- 浏览: 252447 次
- 性别:
- 来自: 厦门
文章分类
最新评论
-
topbox163:
图片显示不了
Flex 学习曲线图 -
彭利贤:
你好,想请教您一些关于flash的问题,您可以加我qq吗 59 ...
全屏flash的尺寸分析 -
jingj6:
是开源的吗?
小日本做的非常强大的一款AS3 3D引擎 -
hugh52066:
LZ牛B。
Flex 学习曲线图 -
sweed0:
a dream~~
一个让人瞠目结舌的传奇电脑高手!
8.2 事件机制的工作流程
8.2.1 关于事件流
目标对象:派发事件的对象
当事件发生后生成一个携带数据的对象,然后检查目标对象是否存在显示层中,并遍历从根容器一直到目标对象所在位置的所有对象,以树形势表示。自动检测所经过的节点是否注册了监听器。
事件流暗运行流程分为3步:
当事件发生后生成一个携带数据的对象,然后检查目标对象是否存在显示层中,并遍历从根容器一直到目标对象所在位置的所有对象,以树形势表示。自动检测所经过的节点是否注册了监听器。
事件流暗运行流程分为3步:
- 捕获阶段:捕获事件 capturing,从根节点开始顺序而下,检测每个节点是否注册了监听器。同时,Flex 将事件对象的currentTarget 值改为当前正在检测的对象。如果注册了监听器,则调用监听函数。
- 目标阶段:检测目标的监听器 targeting:触发在目标对象本身注册的监听程序
- 冒泡阶段:事件冒泡 bubbling:从目标节点到根节点,检测每个节点是否注册了监听器,如果有,则调用监听函数。
每个事件对象都有以下属性:
target:事件的派发者
currentTarget:当前正在检测的的对象,帮助跟踪事件传播的过程。
默认情况下,捕获功能处于关闭状态,一般没有必要进行捕获跟踪。
事件只在bubbles 属性为true 时才进行冒泡,可以冒泡的事件包括:change、click、doubleClick、keyDown、keyUp、mouseDown、 mouseUp。并且不能在一个监听器中同时打开捕获和冒泡功能,要做到这一点,只能注册两个监听器,分别实现。
现在来看一个例子:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()"> <mx:Style source="style.css" /> <mx:Script> <![CDATA[ import flash.events.MouseEvent; internal function initApp():void{ canvas_1.addEventListener(MouseEvent.CLICK,pressBtn,true); canvas_2.addEventListener(MouseEvent.CLICK,pressBtn); btn_1.addEventListener(MouseEvent.CLICK,pressBtn); btn_2.addEventListener(MouseEvent.CLICK,pressBtn); } internal function output(msg:String):void{ debug_txt.text += msg+"\n"; } internal function pressBtn(evt:MouseEvent):void{ output("是否冒泡--"+evt.bubbles); output("目标对象-- "+evt.target+" -- "+evt.eventPhase); output("遍历对象-- "+evt.currentTarget); output("------------"); } ]]> </mx:Script> <mx:Canvas id = "canvas_1" styleName="box" x="37" y="63" width="445" height="216"> <mx:Text x="13" y="10" text="Canvas_1"/> <mx:Canvas id="canvas_2" styleName="box" x="10" y="102" width="173" height="90"> <mx:Text x="10" y="10" text="Canvas_2"/> <mx:Button id = "btn_2" x="10" y="38" label="Button_2"/> </mx:Canvas> <mx:Button id="btn_1" x="16" y="38" label="Button_1"/> </mx:Canvas> <mx:TextArea id="debug_txt" styleName="textBox" x="37" y="304" height="198" width="445"/> </mx:Application>
- target:派发事件的目标对象
- currentTarget:事件流当前正经过的目标对象
- bubbles:是否打开了冒泡功能
- eventPhase:事件流当前的阶段,1:捕获,2:目标,3:冒泡
addEventListener(
type:String, 事件的类型
listener:Function, 监听函数
useCapture:Boolean = false, 是否打开捕获功能
priority:int = 0, 监听器优先级别
useWeakReference:Boolean = false 是否使用弱引用
)
如果useCapture 为true,打开了捕获功能,则该组件的冒泡阶段被取消。
只有可视化的对象有3个阶段,而像XML等非可视化对象只有目标阶段。
8.2.2 事件对象
EventDispatcher 是派发事件的武器,经它派发的事件对象必须是Event类型或者Event的子类。
Event对象中包含目标对象存放的数据,这些数据都成为Event的属性,以供侦听器使用:
Event的属性:
Event对象中包含目标对象存放的数据,这些数据都成为Event的属性,以供侦听器使用:
Event的属性:
- bubbles:只读,布尔,事件是否开启冒泡功能
- cancelable:只读,布尔,处理事件的默认行为是否可以停止。主要针对一些系统事件,如果值为true,则Event的preventDefault方法可以使用,否则不可用。
- currentTarget:只读,对象,当前正在调用监听器的对象
- eventPhase:只读,整数,返回事件流正经历的阶段。1:捕获,2:目标,3:冒泡
- target:只读,派发事件的目标对象
- type:只读,字符,事件类型。比如鼠标点击事件的类型:click,并被定义为常量:MouseEvent.CLICK
构造函数:
Event(
type:String, 事件类型
bubbles:Boolean = false, 是否冒泡
cancelable:Boolean = false 是否可以停止
)
Event 的方法:
- isDefaultPrevented:判断preventDefault 是否已经被调用
- preventDefault:停止事件的默认行为。针对一些系统事件,cancelable为true时才可用。
- stopImmediatePropagation:停止当前的事件流传播,包括当前正在处理的对象
- stopPropagation:停止当前的事件流传播,但不会停止当前正在处理的对象
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()"> <mx:Style source="style.css" /> <mx:Script> <![CDATA[ import flash.events.MouseEvent; internal function initApp():void{ canvas_1.addEventListener(MouseEvent.CLICK,CanvasHandler); canvas_2.addEventListener(MouseEvent.CLICK,CanvasHandler); canvas_2.addEventListener(MouseEvent.CLICK,pressBtn); btn_1.addEventListener(MouseEvent.CLICK,pressBtn); } internal function output(msg:String):void{ debug_txt.text += msg+"\n"; } internal function pressBtn(evt:MouseEvent):void{ output("是否冒泡--"+evt.bubbles); output("目标对象-- "+evt.target+" -- "+evt.eventPhase); output("遍历对象-- "+evt.currentTarget); output("------------"); } internal function CanvasHandler(evt:MouseEvent):void{ output("目标对象-- "+evt.currentTarget+" -- "+evt.eventPhase); //停止事件流的传播 evt.stopImmediatePropagation(); //evt.stopPropagation(); } ]]> </mx:Script> <mx:Canvas id = "canvas_1" styleName="box" x="37" y="63" width="425" height="160"> <mx:Text x="13" y="10" text="Canvas_1"/> <mx:Canvas id="canvas_2" styleName="box" x="10" y="52" width="173" height="90"> <mx:Text x="10" y="10" text="Canvas_2"/> <mx:Button id = "btn_1" x="10" y="38" label="Button_1"/> </mx:Canvas> </mx:Canvas> <mx:TextArea id="debug_txt" styleName="textBox" x="37" y="245" height="198" width="425"/> </mx:Application>
8.2.3 侦听和响应事件--一个侦听键盘事件的例子
要侦听一个事件,首先要创建一个函数来作为事件处理器,然后将这个函数注册给相应的时间类型。
this.addEventListener(KeyboardEvent.KEY_DOWN,keyHandler);
注册键盘按下事件,交给keyHandler处理,也可以在Application标签添加事件:
keyDown="keyHandler(event)" 这种情况无法移除事件。
注册了事件监听器,使用完毕后,必须使用removeEcentListener 方法删除监听函数:
removeEcentListener(
type:String, 事件类型
listener:Function, 监听函数
useCapture:Boolean = false 是否开启捕获功能,如果注册时打开,移除也要打开。
)
this.addEventListener(KeyboardEvent.KEY_DOWN,keyHandler);
注册键盘按下事件,交给keyHandler处理,也可以在Application标签添加事件:
keyDown="keyHandler(event)" 这种情况无法移除事件。
注册了事件监听器,使用完毕后,必须使用removeEcentListener 方法删除监听函数:
removeEcentListener(
type:String, 事件类型
listener:Function, 监听函数
useCapture:Boolean = false 是否开启捕获功能,如果注册时打开,移除也要打开。
)
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()"> <mx:Style source="style.css" /> <mx:Script> <![CDATA[ import flash.events.KeyboardEvent; internal function initApp():void{ this.addEventListener(KeyboardEvent.KEY_DOWN,keyHandler); } private function keyHandler(e:KeyboardEvent):void{ var str:String = "你按下的是: "+e.keyCode; debug_txt.text += str +"\n"; } ]]> </mx:Script> <mx:TextArea id="debug_txt" styleName="textBox" x="25" y="78" height="198" width="212" editable="false"/> <mx:Text x="25" y="50" text="按键盘上的任意键"/> </mx:Application>
发表评论
-
如何使用Cairngorm3的导航库(Spring AS)
2011-08-29 17:39 2900一、概述 二、LIB库包配置 下载需要的LIB库 ... -
Flex学习笔记_06 使用行为对象和动画效果_ 放缩\调整大小效果
2008-09-28 16:47 38286.3.2 放缩效果和调整大� ... -
Flex学习笔记_06 使用行为对象和动画效果_模糊、发光效果
2008-09-27 22:33 31766.3.1 模糊效果和发光效� ... -
Flex学习笔记_06 使用行为对象和动画效果_认识行为对象、行为和组件
2008-08-17 01:30 22316.1 认识行为对象 6.1.1 什么是行为对象 行 ... -
Flex学习笔记_09 数据绑定_运用实例
2008-07-28 23:41 32439.3.1 实现界面的多语言切换 <?xml vers ... -
Flex学习笔记_09 数据绑定_晋级篇
2008-07-28 22:27 28779.2.1 函数和类级别的绑� ... -
Flex学习笔记_09 数据绑定_概念、使用
2008-07-21 23:32 20749.1 认识数据绑定 9.1.1 数据绑定的概念 ... -
Flex学习笔记_08 Flex的事件机制_高级应用
2008-07-16 23:11 32038.3 事件机制的高级应用 8.3.1 事件的优先级别和 ... -
Flex学习笔记_08 Flex的事件机制_事件架构
2008-07-14 08:54 24898.1 一切从事件开始 8.1.1 关于事件 事件有 ... -
Flex学习笔记_07 ActionScript 3.0 编程基础_数据类型及其运算、程序流程
2008-07-13 19:21 46637.3 数据类型和数据运算 7.3.1 关于数据类型 ... -
Flex学习笔记_07 ActionScript 3.0 编程基础
2008-07-09 23:15 28907.1 了解 ActionScript 3.0 7.1 ... -
Flex学习笔记_06 使用组件处理数据和交互_03控件的实例应用
2008-07-06 14:26 25923. 控件的实例应用 3.1 制作一个简单的涂鸦板 ... -
Flex学习笔记_06 使用组件处理数据和交互_02导航类组件
2008-07-02 00:04 30032. 导航类组件 2.1 ToggleButtonBa ... -
Flex学习笔记_06 使用组件处理数据和交互_01常用组件(下)
2008-06-30 10:37 4623Flex学习笔记_06 使用组� ... -
Flex学习笔记_06 使用组件处理数据和交互_01常用组件(中)
2008-06-29 22:50 3974Flex学习笔记_06 使用组件处理数据和交互_01常用组件( ... -
Flex学习笔记_06 使用组件处理数据和交互_01常用组件(上)
2008-06-26 23:11 4540Flex学习笔记_06 使用组件处理数据和交互_01常用组件( ... -
Flex学习笔记_05 使用容器控制界面布局_03动态布局、导航容器、表单布局
2008-06-25 08:40 6716本文的相关文章: Flex学习笔记_05 使用容器控制界面布局 ... -
Flex学习笔记_05 使用容器控制界面布局_02窗口布局
2008-06-24 09:07 5157本文的相关文章: Flex学习笔记_05 使用容器控制界面布局 ... -
Flex学习笔记_05 使用容器控制界面布局_01管理程序的布局
2008-06-23 23:52 5660本文的相关文章: Flex学习笔记_05 使用容器控制界面布局 ... -
Flex学习笔记_04 MXML语言简介
2008-06-17 22:52 54541. MXML语法 MXML语言是专门用于Flex程序中, ...
相关推荐
Flex学习笔记_09 数据绑定_概念、使用 - Java&Flex - JavaEye技术网站 希望对爱好有帮助!!
本教程是作者精心编写的Flex学习资料,适合初学者入门,通过图文并茂的方式,帮助读者快速掌握Flex的基本概念和核心技能。 1. **Flex基础**:Flex提供了MXML和ActionScript两种编程方式。MXML是一种声明式语言,...
《FLEX学习笔记》 FLEX,全称为Flex Builder,是由Adobe公司开发的一款基于MXML和ActionScript的开源框架,用于构建富互联网应用程序(RIA)。它允许开发者创建具有交互性、响应性和丰富用户体验的Web应用。FLEX的...
在本文中,我们将深入探讨Flex学习过程中的基础语法,特别是从AS2到AS3的变化。 首先,ActionScript 3(AS3)是AS的一个重大升级,它引入了完全的面向对象编程(OOP)概念。这意味着AS3具有类、继承、封装和多态性...
本压缩包“Flex学习笔记.rar”显然是一份针对初学者的教程资料,旨在帮助新接触Flex的开发者快速上手。 在“FlexBeginner.pdf”这份文档中,你可以期待找到以下关键知识点: 1. **Flex概述**:介绍Flex技术的基本...
### Flex新手教程_入门级学习笔记 #### ActionScript核心概念 **ActionScript(简称AS)** 是一种面向对象的编程语言,主要用于开发Flex应用程序。掌握AS的基础知识对于学习Flex至关重要。 ##### 类和对象 (Class...
学习者可以通过阅读文档,理解Flex与Java的集成方式,掌握如何创建一个功能完备的留言板系统。这不仅涉及到了前端和后端的开发技术,还涵盖了数据存储和通信的实践,对于提升跨平台应用开发能力十分有帮助。
Flex事件机制是Adobe Flex应用程序开发中的核心组成部分,它允许组件之间进行有效的通信和交互。对于初级Flex程序员或爱好者来说,理解这一机制至关重要。在本文中,我们将深入探讨Flex事件的各个方面,包括事件流、...
Flex学习笔记1 - 容器布局对象状态的切换和数据绑定 在 Flex 应用程序中,容器布局对象状态的切换是非常常见的需求。例如,在购物车应用程序中,我们可能需要在不同的状态之间切换,例如从商品浏览状态到购物车状态...
这篇“Flex学习笔记”可能是作者在深入研究Flex技术过程中整理的心得体会和实践案例,结合了《Flex3权威指南》这本书的内容。 在Flex中,ActionScript是核心编程语言,它是基于ECMAScript的一个版本,专门针对富...
Flex学习笔记(flex必知必会).docFlex学习笔记(flex必知必会).doc
Flex AS3 学习笔记总结 Flex 是 Adobe 开发的 RIA(Rich Internet Applications)工具,包括 Flex3 SDK、Flex Builder 和服务器产品,如 Lifestyle Data Services、CodeFushion。Flex 应用程序用 Flash.swf 文件...
本笔记将深入探讨Flex的基本概念、架构、组件、布局管理器以及事件处理机制,帮助初学者全面理解并掌握Flex开发。 1. **Flex简介**:Flex是一种开放源代码的框架,主要用于创建交互式的、基于Web的用户界面。它允许...
Flex学习笔记概述 Flex是一种由Adobe开发的企业级富互联网应用(RIA)的表示层解决方案,其主要目的是提供高度交互和动态的用户体验。Flex的核心在于它的编程语言MXML和ActionScript(AS),这两种语言结合在一起,...
根据提供的信息,我们可以总结出以下关于Flex学习笔记中的关键技术知识点: ### 1. Flex 基础设置 在Flex开发中,通常会涉及到基础样式的设置。例如,在给定的部分内容中提到了字体大小、颜色及背景色的设置。虽然...
Flex是Adobe公司推出的一种用于构建富互联网...随着对Flex的深入学习,开发者将掌握更多高级特性,如数据绑定、动画效果、组件自定义以及与后端服务器的深度集成等,从而能够创建出更复杂、功能丰富的富互联网应用。
flex学习笔记,刚刚入门的可以看一下,有什么问题可以和我联系,谢谢
Flex ActionScript 学习笔记是关于使用Adobe Flex技术并结合ActionScript 3.0进行开发的知识总结。ActionScript 3.0是随着Flash CS3一起推出的一种强大的编程语言,相较于之前的ActionScript版本,它有着显著的提升...
### Flex 学习笔记知识点详解 #### 一、Flex 技术概述 - **定义**:Flex 是一种用于构建和部署跨浏览器、跨平台的丰富互联网应用程序 (RIA) 的开源框架。 - **特点**: - 强大的 UI 构建能力:允许开发者创建高度...
根据给定的文件信息,我们可以提炼出以下关于Flex学习的关键知识点: ### 1. ActionScript 核心概念 #### 1.1 类和对象 (Class and Object) - **定义**:类是对象的抽象,而对象是类的具体实例。一个类定义了对象...