可以简易治理的弹出组件
可以简易管理的弹出组件
实现了一个简易的弹出管理器，可以设置是否弹出唯一面板，可以配合其它操作更改面板状态，弹出面板按照一定方式排序
组件代码：
组件执行：
视图：
实现了一个简易的弹出管理器，可以设置是否弹出唯一面板，可以配合其它操作更改面板状态，弹出面板按照一定方式排序
组件代码：
package pizazz.flex4.manager.components.popup{
import spark.components.TitleWindow;
public class PopUpItem{
private var _sign:String = "";
private var _window:TitleWindow = null;
private var _state:String = "";
private var _index:Number = -1;
public function get sign():String{
return _sign;
}
public function get window():TitleWindow{
return _window;
}
public function set state(value:String):void{
_state = value;
}
public function get state():String{
return _state;
}
public function set index(value:Number):void{
_index = value;
}
public function get index():Number{
return _index;
}
public function PopUpItem(window:TitleWindow, sign:String = ""){
_window = window;
_sign = sign;
}
}
}
package pizazz.flex4.manager{
import mx.collections.ArrayCollection;
import mx.core.UIComponent;
import mx.events.CollectionEvent;
import mx.managers.PopUpManager;
import pizazz.flex4.manager.components.popup.PopUpItem;
import spark.components.TitleWindow;
public class PopUp{
private var _num:int = 0;
private const _left:uint = 32;
private const _top:uint = 24;
protected const _unique:Object = {};;
protected const _collection:ArrayCollection = new ArrayCollection();
private static var _popup:PopUp;
protected static var _lock:Boolean = false;
protected static var _container:UIComponent;
/**
* 获取弹出数量(建议使用方法PopUp.getInstance().lenght)
*/
public function get length():int{
return _collection.length;
}
public function PopUp(){
if(!_lock){
_collection.addEventListener(CollectionEvent.COLLECTION_CHANGE,
arrange);
}
}
protected function exist(sign:String):PopUpItem{
return _unique.hasOwnProperty(sign) ?
_unique[sign] as PopUpItem : null;
}
private function arrange(event:CollectionEvent):void{
var _length:int = event.target.length;
var _newItem:PopUpItem = event.items[0] as PopUpItem;
if(_length > _num){
var _xMove:Number = 0;
var _yMove:Number = 0;
var _xInterval:uint = 0;
var _yInterval:uint = 0;
for each(var _oldItem:PopUpItem in _collection){
_xInterval += _left;
_yInterval += _top;
if(_xInterval + _left * 4 > _container.width ||
_yInterval + _top * 4 > _container.height){
_xMove = _xInterval - _container.width +
_left * 16;
_yMove = _top * 2;
}else{
_xMove = _xInterval;
_yMove = _yInterval;
}
if(_xMove > _container.width){
_xMove = _left;
}
}
_newItem.window.x = _xMove;
_newItem.window.y = _yMove;
}
_num = _length;
}
protected function addItem(window:TitleWindow, sign:String = ""):void{
var _item:PopUpItem = new PopUpItem(window, sign);
_collection.addItem(_item);
if(sign != ""){
_unique[sign] = _item;
}
}
protected function removeItem(window:TitleWindow):void{
var _item:PopUpItem = getItemIndex(window);
if(_item){
_collection.removeItemAt(_item.index);
if(_item.sign != "" && exist(_item.sign)){
delete _unique[_item.sign];
}
}
}
protected function updateState(window:TitleWindow,
state:String = ""):void{
var _item:PopUpItem = getItemIndex(window);
if(_item){
_item.state = state;
}
}
/**
* 获取PopUp实例
* @return PopUp实例
*/
public static function getInstance():PopUp{
return _popup;
}
/**
* 初始化组件(只能实例化一次)
* @param container PopUpManager.addPopUp中parent参数
*/
public static function init(container:UIComponent):void{
if(!_lock){
_container = container;
_popup = new PopUp();
_lock = true;
}
}
/**
* 获取面板包装对象
* @param window 面板
* @return 包装对象
*/
public function getItemIndex(window:TitleWindow):PopUpItem{
for(var i:int = 0; i < _collection.length; i ++){
var _item:PopUpItem = _collection.getItemAt(i) as PopUpItem;
if(_item.window == window){
_item.index = i;
return _item;
}
}
return null;
}
/**
* 弹出面板
* @param window 需要弹出的面板
* @param mask 是否为模态窗口
* @param sign 面板弹出唯一标志
*/
public static function openWindow(window:TitleWindow,
mask:Boolean = false, sign:String = ""):Boolean {
var _item:PopUpItem = PopUp.getInstance().exist(sign);
if(_item && _item.window.isPopUp){
PopUpManager.bringToFront(_item.window);
return false;
}
PopUpManager.addPopUp(window, _container, mask);
PopUp.getInstance().addItem(window, sign);
return true;
}
/**
* 关闭面板
* @param window 需要关闭的面板
*/
public static function closeWindow(window:TitleWindow):void {
PopUp.getInstance().removeItem(window);
if(window.isPopUp){
PopUpManager.removePopUp(window);
}
}
/**
* 面板状态改变
* @param window 需要改变状态的面板
* @param state 面板状态
*/
public static function updateState(window:TitleWindow,
state:String = ""):void{
PopUp.getInstance().updateState(window, state);
}
}
}
组件执行：
<?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"
minWidth="955" minHeight="600" creationComplete="init()">
<s:layout>
<s:HorizontalLayout />
</s:layout>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.CloseEvent;
import pizazz.flex4.manager.PopUp;
import pizazz.flex4.manager.components.popup.PopUpItem;
import spark.components.TitleWindow;
private var i:int = 0;
private function init():void{
PopUp.init(this);
}
private function onClickA():void{
PopUp.openWindow(windowFactory());
}
private function onClickB():void{
PopUp.openWindow(windowFactory(), false, "unique");
}
private function onClickC():void{
Alert.show("Length: " + PopUp.getInstance().length);
}
private function windowFactory():TitleWindow{
const _window:TitleWindow = new TitleWindow();
_window.width = 320 + i;
_window.height = 240 + i;
_window.title = "" + i++;
_window.addElement(buttonFactory(_window));
_window.addEventListener(CloseEvent.CLOSE,
function(event:CloseEvent):void{
PopUp.closeWindow(_window);
}
);
return _window;
function buttonFactory(window:TitleWindow):Button{
const _button:Button = new Button();
_button.label = "Info";
_button.addEventListener(MouseEvent.CLICK,
function(event:MouseEvent):void{
var _item:PopUpItem =
PopUp.getInstance().getItemIndex(window);
Alert.show("Index: " + _item.index + "\n" +
"Sign: " + _item.sign);
}
);
return _button;
}
}
]]>
</fx:Script>
<s:Button label="一般面板" width="100" click="onClickA()" />
<s:Button label="唯一面板" width="100" click="onClickB()" />
<s:Button label="面板数量" width="100" click="onClickC()" />
</s:Application>
视图：