AS3 Event handling- Part 1

Posted on March 5, 2009


Handling an event in AS3 is quite easy and controlling each phase of event propagation is a bit tricky for beginers. Handling methods in as2 were quite simple, yet they lacked flexibility. This series of event handling is aimed to cover all the stuff in details. This part of the series discusses the event handling process in AS2 & problems faced.

Flash back of event handling in AS2:

In this example let’s take home_mc as a movieclip upon which we will be having and mouse release event. Here is the simple code that we can write for it.

  1. home_mc.onRelease=function(){
  2.          //do what ever you like, I am tracing who is responsible for the event
  3.         trace(this._name);//home_mc
  4. }

onRelease is the mouse release event that home_mc dispatches when ever mouse is released. Well that is quite simple- isn’y it!. Now lets put another movieclip inside  home_mc and name is as window_mc. Add mouse release event on the window_mc.

  1. home_mc.onRelease=function(){
  2.          //do what ever you like, I am tracing who is responsible for the event
  3.         trace(this._name);//home_mc
  4. }
  5. home_mc.window_mc.onRelease=function(){
  6.          //do what ever you like, I am tracing who is responsible for the event
  7.         trace(this._name);//window_mc expected
  8. }

Notice that you will never be able get “window_mc” - in other words you are not able to click. I would not call this as inablity- I would call it a problem- and there are solutions for this. Before knowing the solution lets’ know the reason behind this inability. When ever there is some mouse event like onRollOver, onRelease, onReleaseOutside, onRollout applied on a parent object, its child object can not recieve the mouse events. Now let’s know the solution( this is not a better solution some times - ask me why?).
1.You need to avoid putting mouse events in the parent object
2. You have to create another background object and put action over it.
An example code is given below. For this example I named the background instance as home_back_mc.

  1. home_mc.window_mc.onRelease=function(){
  2.         trace(this._name);
  3. }
  4.  
  5. home_mc.home_back_mc.onPress=function(){
  6.         this._parent.startDrag(false);
  7. }
  8. home_mc.home_back_mc.onRelease=function(){
  9.         this._parent.stopDrag();
  10. }

 Explanation: when you have two different objects inside clip with same heirarchy they have separate events for each.
In most of the cases it works but creates problems in the following cases:
1.You want to drag the parent object by pressing mouse anywhere on the object.
2.After pressing mouse on a object ( let’s call it a) you moved your mouse on another and relased. ( let’s call it b) . There is no direct way to know if you have released your mouse on b. 

As a developer I can not still say that there is no solution for the above to problems. There are ways. Now let’s look at the second type of problem we some time face.

When ever onMouseMove, onMouseUp, onMouseDown events are invoked they are global to the flash player. Hence you may mess up if you write more than two functions for each type of event.

A very basic example demonstrates this.

  1. home_mc.onMouseDown=function(){
  2.                 trace("mouse down event");
  3.         }

In the above example you need not have to click on the home_mc to invoke onMouseDown  event.

Enough flashback, now lets move to AS3 event handling basics. We will cover it in next post.


Posted Under AS3, Flash »


Comments

One Response to “AS3 Event handling- Part 1”

  1. AS3 Clickable Button Inside a Draggable Movie Clip | rabidGadfly on March 15th, 2010 10:38 pm

    [...] a good introduction to AS3 Event Handlers, check out the Newton Flash 6 part series. Even though he uses the moniker of “Devigner”, which I can’t stand, the posts [...]

Leave a Reply