Question

Using AIR 3.1 and testing with both the (desktop AIR) simulator and a Nook Tablet (running Android 2.3).

I’m using the following code to add a modal popup…

PopUpManager.addPopUp( popUp, FlexGlobals.topLevelApplication as DisplayObject, true );

For the web and Desktop versions of AIR, the above code prevents buttons or other things that are under/behind the modal popup from being clickable.
On AIR mobile however, buttons can be clicked behind the modal blocker.

I also tried to create my own modal blocker by adding a 100% width/height UIComponent to the top level application and then displaying my popup on top of that.
I drew a partially transparent rect into the “blocker” UIComponent’s graphics object and then I added a MouseEvent.CLICK listener to it as so:

blocker.addEventListener( MouseEvent.CLICK, onMouseClick, true, int.MAX_VALUE );

// Then my handler looked like this
private function onMouseClick( event:Event ):void {
    event.stopImmediatePropagation();
}

I tried useCapture values of both TRUE and FALSE but the behavior I saw on the Nook stayed the same. I was able to click on buttons that were underneath of my modal blocker.

What am I missing here? Something obvious that I’m overlooking?

Answer 1

You could try adding a Mouse_Down or click listener to the stage, then stopping it’s propagation if the target isn’t a descendant of your popup.

stage.addEventListener(MouseEvent.CLICK,blockClick,true,int.MAX_VALUE,true);

function blockClick(e:MouseEvent):void {
    var curTarget:DisplayObject = e.target as DisplayObject;

    while(curTarget){
        if(curTarget == popup) return;
        curTarget = curTarget.parent;
    }

    e.stopImmediatePropagation();
}