TitleWindow PopUp Can Be Dragged Off Stage!

Question

I am making a popup window using a custom TitleWindow component which is opened by clicking a "Settings" button using the following method:
private var titleWindow:TitleWindow;
private function popUp():void {
    titleWindow = PopUpManager.createPopUp(this, CustomTitleWindow, true) as TitleWindow;
    PopUpManager.centerPopUp(titleWindow);
Everything is working fine, however, I am able to drag it completely outside the stage!  If the user releases the mouse while the window is off the stage, then there is no way to find/grab it again and bring it back on the stage!  Of course, this situation is not too acceptable for customers.  Is there any way that I can limit the popup window to the boundaries of the stage?
Also, if the user clicks the "Settings" button multiple times, multiple popup windows will be opened!  I don`t want to make the popup window modal.  Is there any way to limit instances of the popup window to one?
Thank you in advance for any help anyone can give!
Matt

Answer 1

Hi Matt,
Here's a solution for bounding the moves of a TitleWindow:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" >
    <fx:Script>
        <![CDATA[
            import mx.managers.PopUpManager;
            import spark.components.TitleWindow;
            import spark.events.TitleWindowBoundsEvent;
            private var titleWindow:TitleWindow;
            private function popUp():void
                titleWindow = PopUpManager.createPopUp(this, TitleWindow, true) as TitleWindow;
                PopUpManager.centerPopUp(titleWindow);
                titleWindow.addEventListener(TitleWindowBoundsEvent.WINDOW_MOVING,
                                             titlewindow1_windowMovingHandler);
            protected function titlewindow1_windowMovingHandler(event:TitleWindowBoundsEvent):void
                // These are the new bounds when the window is moved.
                // You can modify them to alter the result of when the TitleWindow moves.
                var endBounds:Rectangle = event.afterBounds;
                // left edge of the stage
                if (endBounds.x < 0)
                    endBounds.x = 0;
                // right edge of the stage
                if ((endBounds.x + endBounds.width) > this.width)
                    endBounds.x = this.width - endBounds.width;
                // top edge of the stage
                if (endBounds.y < 0)
                    endBounds.y = 0;
                // bottom edge of the stage
                if ((endBounds.y + endBounds.height) > this.height)
                    endBounds.y = this.height - endBounds.height;
        ]]>
    </fx:Script>
    <s:Button click="popUp()" />
</s:Application>
Basically, I add an event listener for the "windowMove" event on the TitleWindow and limit where it can move around in the application. You can see the ASDoc for TitleWindowBoundsEvent for more information. Hope this helps!
-Kevin