Mouse Click Lifecycle September 22, 2007

Events are broadcast in exactly this order:

1. MouseDown
2. MouseUP
3. MouseClick

If you play with it, note that MouseClick is triggered without a regard to time. The user could hold down the button for a year, drag it over and out of the clip, and as long as it's released over the same clip it was over, it registers a click.  Often in gestural UI's this is not the desired behavior, as that's not really click like, say like Double Click, two Press/Release event within a window of time. This is pretty easy to solve just do something like:

public function onPress(event:MouseEvent= null):void{
isPressed = true;
clickTime = getTimer();
}

public function onClick(event:MouseEvent= null):void{
var exitTime = (clickTime + 200); //200MS is reasonable click time.
var curTime = getTimer();
trace("mouse Click " + clickTime + " " + exitTime);
if( curTime < exitTime){
//do something with the click tim
}

}

Handling releaseOutside

Another gotcha, was the removal of releaseOutside. The comments here somewhat cover it. Though for my own solution I ended up using rollOver and rollOut to register the off stage release/click listener, that when back over the interested clip, remove it.

public function onRollOut(event:MouseEvent= null):void{
trace("onRollOut**************************************" + _clip);
//onReleaseOutside();
_clip.stage.addEventListener(MouseEvent.MOUSE_UP, onReleaseOutside);//, true); //recommended didn't work
}
public function onRollOver(event:MouseEvent= null):void{
trace("onRollOver******************************************");
_clip.stage.removeEventListener(MouseEvent.MOUSE_UP, onReleaseOutside);}