Creating Popup using ActionScript

To launch a pop-up, we use PopupManager class in flex. The example below demonstrates on how to create a popup using ActionScript. The PopUpManager singleton class creates new top-level windows and places or removes those windows from the layer on top of all other visible windows.

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.

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml”
layout=”horizontal”
verticalAlign=”middle”
backgroundColor=”white”
creationComplete=”init()”>

<mx:Panel id=”panel11″ width=”126″ height=”100″ layout=”absolute” title=”PopupManager”>
<mx:Button id=”but1″ x=”14″ y=”10″ label=”Click Here” click=”createPopUp(event)”/>
</mx:Panel>

<mx:Script>
<![CDATA[
import mx.containers.ControlBar;
import mx.containers.Panel;
import mx.controls.Button;
import mx.managers.PopUpManager;

private var panel:Panel;

private function init():void {

var cb:ControlBar = new ControlBar();

var b1:Button = new Button();
var b2:Button = new Button();

b1.label = "OK";
b1.addEventListener(MouseEvent.CLICK, closePopUp);
b2.label = "Cancel";
b2.addEventListener(MouseEvent.CLICK, closePopUp);

cb.addChild(b1);
cb.addChild(b2);

panel = new Panel();
panel.title = "RajiniKanth Panel";
panel.width = 240;
panel.height = 180;
panel.addChild(cb);
}

private function closePopUp(evt:MouseEvent):void {
PopUpManager.removePopUp(panel);
}

private function createPopUp(evt:MouseEvent):void {
PopUpManager.addPopUp(panel, this, true);
PopUpManager.centerPopUp(panel);
}
]]>
</mx:Script>
</mx:Application>

Popularity: 16% [?]