6 Replies Latest reply on Feb 3, 2011 6:34 AM by phaseblue

    TitleWindow PopUp Can Be Dragged Off Stage!

    phaseblue Level 1

      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

       

      
      

        • 1. Re: TitleWindow PopUp Can Be Dragged Off Stage!
          dave cragg Level 2

          If it's a Spark TitleWindow, the following windowMoveEnd handler should cause the window to move back to its previous position at the end of a drag if the dragArea is off screen.

           

           

          private function windowDragEnd(e:TitleWindowBoundsEvent):void

          {

          // ensures the window will not be left off screen if it is dragged too far

            var windowX:Number = e.afterBounds.x;

            var windowY:Number = e.afterBounds.y;

            var dH:Number = moveArea.height;

            if (windowY + dH < 6)

            {

              this.x = e.beforeBounds.x;

              this.y = e.beforeBounds.y;

            }

            else if (windowX * -1 > e.afterBounds.width - 6)

            {

              this.x = e.beforeBounds.x;

              this.y = e.beforeBounds.y;

            }

            else if (windowY > (stage.stageHeight - 6))

            {

              this.x = e.beforeBounds.x;

              this.y = e.beforeBounds.y;

            }

            else if (windowX > (stage.stageWidth - 6))

            {

              this.x = e.beforeBounds.x;

              this.y = e.beforeBounds.y;

            }

          }

          1 person found this helpful
          • 2. Re: TitleWindow PopUp Can Be Dragged Off Stage!
            phaseblue Level 1

            dave,

             

            Thank you very much for this!

            • 3. Re: TitleWindow PopUp Can Be Dragged Off Stage!
              Pablo Souza Level 3

              Hi Matt,

               

              About limiting instances of the popup window, you can have something like the code below:

               

              private var titleWindow:TitleWindow;
              
              private function popUp():void
              {
                   if(!titleWindow)
                   {
                        titleWindow = PopUpManager.createPopUp(this, MyPopup) as TitleWindow;
                        titleWindow.addEventListener(CloseEvent.CLOSE, closeHandler);
                        PopUpManager.centerPopUp(titleWindow);
                   }
              }
              
              
              protected function closeHandler(event:CloseEvent):void
              {
                   PopUpManager.removePopUp(titleWindow);
                   titleWindow = null;
              }
              
              

               

               

               

              Let me know if you need further information.

               

               

              Best regards,

              Pablo Souza

              1 person found this helpful
              • 4. Re: TitleWindow PopUp Can Be Dragged Off Stage!
                kevinklin Adobe Employee

                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

                • 6. Re: TitleWindow PopUp Can Be Dragged Off Stage!
                  phaseblue Level 1

                  Thanks a lot guys!

                   

                  For the TitleWidow bounds problem, I ended up going with Kevinklin`s solution because it keeps the window within the boundaries of the stage at all times.

                  Thanks also pablosouza!

                   

                  Both solutions worked beautifully!

                   

                  Matt