那么这个非常重要的东西,该如何去应用呢?在这之前,我们要清楚一个事情,那就是Event是Object这个伟大父亲的220多个孩子之一,也就是说,它是直接继承于Object的。可是我们知道这有什么用处呢,嘿~,用处大啦,因为这代表了Event的贵族气质,即:在Event中,级别高的控件触发的事件,在级别低的控件中是无法被监听到的,怎么样,够高傲了吧。
到了这里,有人会说,这有点扯了吧,只从这个就能看出这点吗?答案当然不是啦,原理听小生一一道来~
在flex中,事件分成了两类,一个是系统事件,一个自定义事件。系统事件是包含鼠标点击,焦点获得等等。自定义,顾名思义,是自己定义的事件啦,但是要注意,自定义的事件必须要继承于Event这个类,否则,listener是不会搭理你滴~。那么自定义事件该如何定义呢,下面有一个例子,会对你有帮助。
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/1fa987a29c6482f53d401256f96355eb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/ca75c07623e1b494fee67e8f316fc310.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/9b8a8a44dd1c74ae49c20a7cd451974e.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/97e794c86028c5f5b5461ae5ef440a4c.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3c6cafce68eb941a00f1998f1d3d3aa6.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/9b8a8a44dd1c74ae49c20a7cd451974e.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/d18c02628675d0a2c816449d98bda930.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/ecedf933ec37d714bd4c2545da43add2.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/8f1ba5b45633e9678d1db480c16cae3f.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
够简单了吧,当然,这只是一个不包含任何其它处理的自定义事件。现在有人可能会问了,自定义方法中的参数有啥用,都是干哈的啊?嘿,暂时保密。
有了自定义事件,那么我们的下一个问题就来啦,自定义事件有了,那么该如何触发,又如何监听呢,别着急啦~~,下面就说。
在flex中,我们自定义触发事件用的是dispatchEvent(Event),里面存放的就是我们上面提到的自定义Event事件~。系统定义的触发事件,例如:<mx:Button id="testMs" x="71" y="295" label="Button" click = “”/>鼠标点击的事件等等。
那么监听的方法呢,监听是这样来定义的。
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
怕了吧,是不是参数很多,和我们平时用的有点不太一样,我们平时,一般都是这样用的
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
后面多出的参数是什么意思呢?要想清楚知道这些,我们必须要先说明一下flex中事件处理的流程。
在Flex中,触发事件后,流程分为三部分,例如,我们有下面这个
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4f1150b881333f12a311ae9ef34da474.gif)
假设,在<mx:VBox>中触发一个事件。事件的触发顺序是这样的,先捕捉,然后目标,最后上浮。
捕捉:在我们刚才的假设中,首先触发器会按<mx:Panel>-><mx:HBox>-><mx:VBox>这个顺序来检查每个节点.这个阶段,我们称为捕捉阶段,在addEventListener的构造函数中,我们默认是不监听这个阶段的。
目标:顾名思义,就是<mx:VBox>这个触发事件的节点。
上浮:<mx:VBox>-><mx:HBox>-><mx:Panel>是按照这个顺来检查每个节点是否注册了监听。
了解了Flex中事件的处理流程,那么我们可以解释addEventListener三个参数的意义啦。
useCapture:Boolean=false,表示的,这个监听是能在目标阶段和上浮阶段进行监听
useCapture:Boolean=true,表示的是这个监听只能在捕捉阶段进行监听。
priority:Integer=0, 优先级,监听是有优先级的,那么通过这个字段,我们可以轻松的改变监听的优先级,是不是很方便,默认的时候为0;
useWeakReference:Boolean=false // 是否设定为弱引用 这个参数的意思是,在该监听不使用的时候,是否允许垃圾回收器,将该监听回收。这个很重要,因为addEventListener有点类似千年老龟,生命周期比较长,如果没有被回收掉,会一直占着系统资源的。
最后有一点,要非常注意,在UI的监听执行完毕后,一定要将该监听移除removeEventListener,否则,即使UI被移除掉,监听也不会被销毁。这个比较重要,因为一些看起来比较诡异的错误,大部分是因为这个导致的。
现在来解惑先前的埋伏下的悬念:
MyEvent (type:String, bubbles:Boolean = false, cancelable:Boolean = false)
bubbles:Boolean = false:这个事件是否参与上浮阶段
cancelable:Boolean = false // 确定是否可以取消 Event 对象
所以,在application中,触发的事件,它的底层,是无法监听到的,收笔回家~