4 Replies Latest reply on Jan 17, 2007 7:01 PM by ntsiii

    PopupWindow

    RyoZero Level 1
      How i do to show a popup window with mxml componente....?
        • 1. PopupWindow
          QuickStick Level 1
          In Flex Builder:

          1. Create a new sub-directory to your main project folder called custom.

          2. Right-click on the folder, select New > MXML Component.

          3. Name the file popUp.mxml and change the Based on: drop-down to Canvas.

          In popUp.mxml (Source View):

          4. Add the attribute creationComplete="popUpCenter();" to the mx:Canvas tag.

          5. Add the script below into the Canvas tag:

          ---------------------

          <mx:Script>

          <![CDATA[

          import mx.managers.PopUpManager;

          public function popUpCenter():void {

          PopUpManager.centerPopUp(this);

          }

          ]]>

          </mx:Script>

          ---------------------

          In your Main MXML file:

          6. Add the script below into the Application tag:

          ---------------------

          <mx:Script>

          import mx.managers.PopUpManager;

          import mx.containers.TitleWindow;

          import mx.core.IFlexDisplayObject;

          //Change 'custom' if you change the sub-directory location of the popUp.mxml...
          //(e.g. If the directory is "custom/popup/popUp.mxml" then this should be: "custom.popup.popUp")
          import custom.popUp;


          public var popUpWindow:IFlexDisplayObject;


          public function showPopUp():void {

          popUpWindow = PopUpManager.createPopUp(this, popUp, true);

          }


          public function hidePopUp():void {

          PopUpManager.removePopUp(popUpWindow);

          }

          </mx:Script>

          ---------------------

          In popUp.mxml (Design View):

          7. Go nuts, resize this canvas to the size you want your popup, add whatever else you want or need in the popup.

          In your Main MXML file:

          8. Call the function "showPopUp();" to show the popup ( ).

          9. Call the function "hidePopUp();" to hide the popup ( ).

          10. Done.

          Anything problems with that, or any mods you may want to know, please let me know, it's from a previous project, so I may have missed something.

          Hope that helps.
          Oz.
          • 2. Re: PopupWindow
            RyoZero Level 1
            IFlexDisplayObject.....

            With this object a cant send object references from my Application to my popup window..

            I have 3 MXML components i need show as popup each one, and send reference to retrive a value. is posssible do that....?
            • 3. Re: PopupWindow
              QuickStick Level 1
              1. Change the Main MXML file as follows:

              ------------------------

              public var popUpWindow:popUp;

              public function showPopUp():void {

              popUpWindow = popUp(PopUpManager.createPopUp(this, popUp, true));

              //Change / add this to reflect the object(s) in the popUp you want to change...
              popUpWindow.objectID.property = "New text";

              }

              ------------------------

              2. Use the function:

              ------------------------

              PopUpManager.removePopUp(this);

              ------------------------

              ...within the popUp component, to close the window, (e.g. on a click event).

              Sorry, I haven't quite got this function to work outside of the component, you may have some more luck than me.

              Hope that helps.