実用例の動画です。
PopUpManagerはFlexにもありましたが、使用方法もほぼ一緒です。
PopUpManagerクラスを利用してみます。
PopupWindowコンポーネント
使用クラス
protected var theme:MetalWorksMobileTheme;
private var popUpWindow:PopUpWindow;
private function doPopUpWindow():void
{
this.theme = new MetalWorksMobileTheme(this.stage);
popUpWindow = new PopUpWindow();
popUpWindow.addEventListener(PopUpWindow.WINDOW_CLOSE,popUpWindowCloseHandler);
popUpWindow.width = 320;
popUpWindow.height = 240;
PopUpManager.addPopUp(popUpWindow);
}
private function popUpWindowCloseHandler(event:Event):void
{
PopUpManager.removePopUp(popUpWindow);
popUpWindow.dispose();
}
PopUpWindow.as
package controls
{
import feathers.controls.Button;
import feathers.core.FeathersControl;
import feathers.display.Scale9Image;
import feathers.textures.Scale9Textures;
import flash.geom.Rectangle;
import starling.animation.Transitions;
import starling.core.Starling;
import starling.events.Event;
import starling.textures.Texture;
public class PopUpWindow extends FeathersControl
{
[Embed(source="./assets/scale9.png")]
private static const SCALE_9_TEXTURE:Class;
public static const WINDOW_CLOSE:String = "windowClose";
public function PopUpWindow()
{
super();
}
private var okButton:Button;
private var bg:Scale9Image;
override protected function initialize():void
{
var texture:Texture = Texture.fromBitmap(new SCALE_9_TEXTURE(), false);
var textures:Scale9Textures = new Scale9Textures(texture,new Rectangle(20, 20, 20, 20));
bg = new Scale9Image(textures, 1);
bg.width = width;
bg.height = height;
bg.x = bg.pivotX = width >> 1;
bg.y = bg.pivotY = height >> 1;
addChild(bg);
okButton = new Button();
okButton.label = "Ok";
okButton.width = 100;
okButton.height = 48
addChild(okButton);
okButton.x = (bg.width >> 1) - (okButton.width >> 1);
okButton.y = (bg.height >> 1) - (okButton.height >> 1);
okButton.addEventListener(Event.TRIGGERED, button_triggeredHandler);
Starling.juggler.tween(bg, 1,
{
transition: Transitions.EASE_OUT_BOUNCE,
onStart:tweenStartHandler,
onComplete:tweenCompleteHandler,
scaleX: 1,
scaleY: 1
});
}
private function button_triggeredHandler(event:Event):void
{
dispatchEventWith(WINDOW_CLOSE);
}
private function tweenStartHandler():void
{
okButton.visible = false;
bg.scaleX = 0;
bg.scaleY = 0;
}
private function tweenCompleteHandler():void
{
okButton.visible = true;
}
override public function dispose():void
{
bg.dispose();
okButton.dispose();
removeChildren();
super.dispose();
}
}
}
Windowで使用する9Scale用の素材
