flash propagation_deletion_of_listeners

As we saw in the article entitled The Event Model; when we want to prevent the listening of an event we use the removeEventListener method.

When we have subscribed a listener for a specific phase we need to specify the same phase when making the call for the removeEventListener method.

If we want to listen to an event for the capture phase:

objetParent.addEventListener ( MouseEvent.CLICK, clickButton, true );

To delete the listening we need to specify the appropriate phase:

objetParent.removeEventListener ( MouseEvent.CLICK, clickButton, true );

It is the same for the bubbling and target phases:

objetParent.removeEventListener ( MouseEvent.CLICK, clickButton, false );
objetTarget.removeEventListener ( MouseEvent.CLICK, clickButton, false );

Or in a more implicit way:

objetParent.removeEventListener ( MouseEvent.CLICK, clickButton );
objetTarget.removeEventListener ( MouseEvent.CLICK, clickButton );

By integrating this in our previous example we get the following code:

// number of windows
var lng:int = 12;
// creation of a container
var windowsContainer:Sprite = new Sprite();
// added to the display list
addChild ( windowsContainer );
var myWindow:Window;
// modification of the animation’s speed
stage.frameRate = 30;
for (var i:int = 0; i< lng; i++ )
{
myWindow = new Window();
myWindow.destX = 7 + Math.round ( i % 3 ) * ( myWindow.width + 10 );
myWindow.destY = 7 + Math.floor ( i / 3 ) * ( myWindow.height + 10
);
// subscription of each instance for the target phase
myWindow.addEventListener ( MouseEvent.CLICK, listenPhase );
// unsubscription of each occurrence for the target phase
myWindow.removeEventListener ( MouseEvent.CLICK, listenPhase );
myWindow.addEventListener ( Event.ENTER_FRAME, movement );
windowsContainer.addChild ( myWindow );
}
function movement ( pEvt:Event ):void
{
// inertia algorithm
pEvt.target.x -= ( pEvt.target.x - pEvt.target.destX ) * .3;
pEvt.target.y -= ( pEvt.target.y - pEvt.target.destY ) * .3;
}
// subscription of the container for the capture phase
windowsContainer.addEventListener ( MouseEvent.CLICK, listenPhase, true );
// unsubscription of the container for the capture phase
windowsContainer.removeEventListener ( MouseEvent.CLICK, listenPhase, true
);
// subscription of the container for the bubbling phase
windowsContainer.addEventListener ( MouseEvent.CLICK, listenPhase );
// unsubscription of the container for the bubbling phase
windowsContainer.removeEventListener ( MouseEvent.CLICK, listenPhase );
function listenPhase ( pEvt:MouseEvent ):void
{
/* displays :
1 : Capture phase of the event: click
Objet target : [object Window]
Objet notified : [object Sprite]
2 : Target phase of the event: click
Objet target : [object Window]
Objet notified : [object Window]
3 : Bubbling phase of the event : click
Objet target : [object Window]
Objet notified : [object Sprite]
*/
switch ( pEvt.eventPhase )
{
case EventPhase.CAPTURING_PHASE :
trace ( pEvt.eventPhase + " : Capture phase of the event: "
+ pEvt.type );
break;
case EventPhase.AT_TARGET :
trace ( pEvt.eventPhase + " : Target phase of the event: " +
pEvt.type );
break;
case EventPhase.BUBBLING_PHASE :
trace ( pEvt.eventPhase + " : Bubbling phase of the event :
" + pEvt.type );
break;
}
trace( "Objet target : " + pEvt.target );
trace( "Objet notified : " + pEvt.currentTarget );
trace ( "Event participating in the bubbling phase: " + pEvt.bubbles );
}

Worth remembering

• The bubbles property of an event object allows you to know if the event in progress participates in the bubbling phase.
• When we have subscribed a listener to a specific phase we need to specify the same phase when calling the removeEventListener method.

In the previous articles we have touched on many key concepts that we are now going to put into practice in the chapter entitled Interactivity.