How can I prevent items behind a pop-up titlewindow from receiving mouse events?

I have a Popup skinned TitleWindow that I am using as a popup, but the items behind it are receiving mouse over and click events. Is there an option that lets me prevent mousevents from happening behind the main content group of the window?

EDIT: To clarify - I'm not asking how to make a window modal. Items literally behind the popup - not on the main form but to the side, but behind and hidden - are receiving mouse events when the user clicks on an area of the contentGroup skin part. This doesn't happen if the user clicks on items within that group, but a slight miss might trigger an unexpected backgrou开发者_如何学Cnd button.

When you create the pop up set modal=true. Something like:

var pop:MyPopUpClass = PopUpManager.createPopUp(parent, MyPopUpClass, true) as MyPopUpClass;

You need to make your popup window as modal window. when u make something modal, it means that window (Alert, popup, titleWindow etc) will remain at top and rest of the screen freezes till the top window closes.

"The PopUpManager also provides modality, so that windows below the popup cannot receive mouse events, and also provides an event if the user clicks the mouse outside the window so the developer can choose to dismiss the window or warn the user."

Default value of modal is false. you can set it to true by pasing true while addPopup or createPopup

public static function addPopUp(window:IFlexDisplayObject, parent:DisplayObject, modal:Boolean = false, childList:String = null):void 

public static function createPopUp(parent:DisplayObject, className:Classe, modal:Boolean = false, childList:String = null):IFlexDisplayObject 

I solved this by replacing this:

<s:SparkSkin ...>
<s:Rect height="{hostComponent.height}" radiusX="10" width="{hostComponent.width}">
    <s:fill>
        <s:SolidColor color="#F5F4EB"/>
    </s:fill>
</s:Rect>

<!-- header, move area, close button and other details -->
<s:Group id="contentGroup"
     top="40"
     left="10"
     right="10"
     bottom="10">

</s:Group>
</s:SparkSkin>

With this:

<s:SparkSkin ...>
<s:Rect height="{hostComponent.height}" radiusX="10" width="{hostComponent.width}">
    <s:fill>
        <s:SolidColor color="#F5F4EB"/>
    </s:fill>
</s:Rect>
<!-- header, move area, close button and other details -->
<s:Group top="40"
     left="10"
     right="10"
     bottom="10">
    <s:Rect top="0"
        left="0"
        right="0"
        bottom="0">
        <s:fill>
            <s:SolidColor color="0xF5F4EB" />
        </s:fill>
    </s:Rect>
    <s:Group id="contentGroup"
             top="0"
             left="0"
             right="0"
             bottom="0">

    </s:Group>
</s:Group>
</s:SparkSkin>

Creating a rectangle object behind the group has made it so that it accepts click events normally.

If you aren't looking for the modal answer, then all I can recommend is removing all relevant listeners when the popup is opened, and adding them back when the popup is removed.

x.removeEventListener(MouseEvent.CLICK...
PopUpManager.addPopup(...


onClose(...
x.addEventListener(MouseEvent.CLICK...

Try using the opaqueBackground property.