1.11.使用事件冒泡机制

1.11.1.问题
我想监听从子组件传递到父组件的所有事件而不必创建一连串事件监听器。
1.11.2.解决办法
使用Flash Player的事件冒泡机制监听从子组件传递来的事件。
1.11.3.讨论
我们需要通过几个类来了解冒泡事件,很多类型的事件都可以冒泡:mouse-down事件,click事件,keyboard 事件。术语“向上冒泡”指的是事件通过其自身的处理方式从显示列表传递到应用程序容器,这就像水里的气泡上升到水面那样。当用户点击任何组件时,其事件就会通过层级向上传递,也就意味着父组件也能监听到click事件,无论哪个子组件发出事件,父组件都能收到。要想父组件监听所有子组件发出的某一类型的事件,父组件只需添加一个事
件监听器即可收到子组件传递过来的事件。
看看BubblingComponent.mxml中定义的类:
+展开
-XML
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxmlwidth="400height="200">
<mx:Script>
<![CDATA[
private function sendClick():void {
trace("BubblingComponent:: click");
}

]]>
</mx:Script>
<mx:Button click="sendClick()"/>
</mx:HBox>

该组件包含一个按钮,它会发出click事件并传递给包含它的任何父组件,要监听此事件,使用click处理函数:
+展开
-XML
<cookbook:BubblingComponent click="handleClick()id="bubbler"/>

BubblingHolder包含BubblingComponent,如下面的代码:
+展开
-XML
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxmlwidth="400height="300xmlns:cookbook="oreilly.cookbook.*creationComplete="complete()">
<mx:Script>
<![CDATA[
private function handleClick():void {
trace("BubblingComponentHolder:: click");
}

]]>
</mx:Script>
<cookbook:BubblingComponent click="handleClick()id="bubbler"/>
</mx:Canvas>

该组件将发出事件给任何监听此事件的组件,当你把BubblingHolder添加到主应用程序文件, 甚至会传递给应用程序层。
+展开
-XML
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxmllayout="verticalxmlns:cookbook="oreilly.cookbook.*">
<mx:Script>
<![CDATA[
public function createName():void {
name = "Flex Cookbook" ;
}

]]>
</mx:Script>
<cookbook:BubblingComponentHolder click="handleClick()"/>
</mx:Application>

BubblingComponent.mxml中的click事件将被广播一直传到应用程序层。

MouseEvent类中的事件序列发出关于此事件的信息,比如click事件和click时鼠标的位置,通过显示列表到达所有的子节点,接着子节点接收此事件,然后从显示列表返回到Stage。

Stage 检测MouseEvent 并传递它到显示列表,直到找到此事件的目标,这就是用户与之交互的目标组件,这被称之为捕获阶段。接着,事件目标对象的事件处理函数被调用,这称之为目标阶段,最后,冒泡阶段触发,发送事件返回给显示列表给其他监听器,所有方式重新回到Stage 阶段。

加支付宝好友偷能量挖...


评论(0)网络
阅读(110)喜欢(0)flash/flex/fcs/AIR