Cacher is the code snippet organizer for pro developers

/**
 * Using Popup Behavior with Swiz and registerWindow()
 *
 * Source is available on GitHub project: Flex-Extensions
 *
 * https://github.com/CodeCatalyst/flex-extensions/blob/develop/src/com/codecatalyst/component/behavior/ui/Popup.as
 * 
 */
 
 <?xml version="1.0" encoding="utf-8"?>
 <SomeCustomUIComponent implements="org.swizframework.core.ISwizAware"
                         xmlns:controls="mypackage.components.*"
                         xmlns:fe="http://fe.codecatalyst.com/2011/flex-extensions"
                         xmlns:mx="http://www.adobe.com/2006/mxml">

 <mx:Metadata>
   [Event(name="maximize", type="flash.events.Event")]
 </mx:Metadata>

 <mx:Script>
   <![CDATA[
     import com.codecatalyst.factory.ClassFactory;
     import com.zyrion.traverse.core.controls.CalloutContainer;
   
     import mx.effects.Fade;

     import org.swizframework.core.ISwiz;

    /**
      * Implement ISwizAware so that we get the Swiz instance injected. We'll use this
      * to register additional PopUps.
      */
     public function set swiz( swiz : ISwiz ) : void
     {
       _swiz = swiz;
     }
     private var _swiz : ISwiz;
         
   /**
    * Show the EmployeeEditor as popup for the current Employee
    *   
    *    * fades in window in bottom right popup, 
    *    * uses swiz for injection
    *    * auto-closes with mouseClicks outside popup
    *    * fadeOut hides popup
    *    * reuses popup instance from internal cache
    *    * can use ANY content as a renderer
    *    * popup positioned relative to the parent; e.g. which is set to "stage"
    *    * or use popup.showAt(globalLoc, offset) for manual positioning
    *
    */
    protected function onShowEmployeeEditor(e:Event):void {

       // WOW! Couldn't be easier. 
       _swiz.registerWindow( popup.show() );
   }

   ]]>
 </mx:Script>


  <!--
      Note the Popup is a behavior NOT a UI instance, as such
      the popup content does NOT affect the display list until
      you invoke popup.show()
  -->
  <ui:Popup   id="popup"
        parent="{this.stage}"
        showEffect="{ new com.codecatalyst.factory.ClassFactory(Fade,null,{duration:600, alphaFrom:0}) }"   
        hideEffect="{ new com.codecatalyst.factory.ClassFactory(Fade,null,{duration:400, alphaTo:0}) }"   
        xmlns:ui="com.codecatalyst.component.behavior.ui.*">
      
    <ui:renderer>
      <mx:Component>
    
        <!-- 
            Use the CalloutContainer as a shell container with borders and shows and fill
            Inside the callout, render the `true` content EmployeeEditor
            Align the popup relative to bottom right corner of stage 
            
            Note: This class uses Swiz [Inject] and requires _swiz.registerWindow usages
        -->
        
        <controls:CalloutContainer arrowPosition="top" bottom="100" right="100">
    
          <editor:EmployeeEditor />
    
        </controls:CalloutContainer>
    
      </mx:Component>
    </ui:renderer>
    
  </ui:Popup>
  
  <!-- 
       Your regular view, child tags go here
       ...
  -->

</SomeCustomUIComponent>