画出类似于遨游那样的最大化,最小化,关闭,还原按钮的皮肤。
使用path路径画笔进行绘制。
CloseButtonSkin:
flex/spark"
xmlns:fx="http://ns.adobe.com/mxml/2009">
[HostComponent("spark.components.Button ")]
MaximizeButtonSkin:
flex/spark"
xmlns:fx="http://ns.adobe.com/mxml/2009">
[HostComponent("spark.components.Button ")]
width="10"
x="4"
y="6">
MinimizeButtonSkin:
flex/spark"
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:d="http://ns.adobe.com/fxg/2008/dt">
[HostComponent("spark.components.Button ")]
flex/spark"
xmlns:fx="http://ns.adobe.com/mxml/2009">
[HostComponent("spark.components.Button ")]
width="8"
x="3"
y="8">
width="8"
x="8"
y="3">
package
{
import events.FxWindowEvent;
import skins.FxWindowSkin;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
import mx.core.IVisualElementContainer;
import mx.managers.CursorManager;
import spark.components.Button;
import spark.components.Panel;
[Event(name="close", type="events.CzWindowEvent")]
[Event(name="maximize", type="events.CzWindowEvent")]
[Event(name="minimize", type="events.CzWindowEvent")]
[Event(name="restore", type="events.CzWindowEvent")]
[Event(name="focusstart", type="events.CzWindowEvent")]
[Event(name="focusend", type="events.CzWindowEvent")]
public class FxWindow extends Panel
{
[Embed(source="assets/resizeCursorH.gif")]
private static var DEFAULT_RESIZE_CURSOR_HORIZONTAL:Class;
[Embed(source="assets/resizeCursorTLBR.gif")]
private static var DEFAULT_RESIZE_CURSOR_TL_BR:Class;
[Embed(source="assets/resizeCursorTRBL.gif")]
private static var DEFAULT_RESIZE_CURSOR_TR_BL:Class;
[Embed(source="assets/resizeCursorV.gif")]
private static var DEFAULT_RESIZE_CURSOR_VERTICAL:Class;
public function FxWindow()
{
super();
setStyle("cornerRadius", 6);
setStyle("skinClass",FxWindowSkin);
windowState=FxWindowState.NORMAL;
}
//改变窗口尺寸的按钮=========start==============
[SkinPart(required="false")]
public var bottomLeftResizeButton:Button;
[SkinPart(required="false")]
public var bottomResizeButton:Button;
[SkinPart(required="false")]
public var bottomRightResizeButton:Button;
[SkinPart(required="false")]
public var leftResizeButton:Button;
[SkinPart(required="false")]
public var rightResizeButton:Button;
[SkinPart(required="false")]
public var topLeftResizeButton:Button;
[SkinPart(required="false")]
public var topResizeButton:Button;
[SkinPart(required="false")]
public var topRightResizeButton:Button;
//改变窗口尺寸的按钮=========end==============
//控制窗口状态的按钮=========start==============
[SkinPart(required="false")]
public var minimizeButton:Button;
[SkinPart(required="false")]
public var restoreButton:Button;
[SkinPart(required="false")]
public var maximizeButton:Button;
[SkinPart(required="false")]
public var closeButton:Button;
//控制窗口状态的按钮=========end==============
private var _hasFocus:Boolean;
private var _windowState:int;
private var currentResizeHandle:Button;
private var dragAmountX:Number;
private var dragAmountY:Number;
private var dragMaxX:Number;
private var dragMaxY:Number;
private var dragStartMouseX:Number;
private var dragStartMouseY:Number;
private var normalHeight:Number;
private var normalWidth:Number;
private var normalX:Number;
private var normalY:Number;
private var savedWindowRect:Rectangle;
private var _maximizable:Boolean=true;
private var _minimizable:Boolean=true;
private var _resizable:Boolean=true;
private var _closable:Boolean=true;
private var _dragable:Boolean=true;
public function get dragable():Boolean
{
return _dragable;
}
public function set dragable(value:Boolean):void
{
_dragable = value;
}
public function get closable():Boolean
{
return _closable;
}
public function set closable(value:Boolean):void
{
_closable = value;
}
public function get resizable():Boolean
{
return _resizable;
}
public function set resizable(value:Boolean):void
{
_resizable = value;
}
public function get minimizable():Boolean
{
return _minimizable;
}
public function set minimizable(value:Boolean):void
{
_minimizable = value;
}
public function get maximizable():Boolean
{
return _maximizable;
}
public function set maximizable(value:Boolean):void
{
_maximizable = value;
}
public function get hasFocus():Boolean
{
return _hasFocus;
}
public function set hasFocus(value:Boolean):void
{
if (_hasFocus == value)
{
return;
}
_hasFocus=value;
focusHandle();
}
private function focusHandle():void
{
if (hasFocus == true)
{
this.alpha=1;
IVisualElementContainer(parent).setElementIndex(th is, this.parent.numChildren - 1);
dispatchEvent(new FxWindowEvent(FxWindowEvent.FOCUS_START));
}
else
{
this.alpha=0.6;
dispatchEvent(new FxWindowEvent(FxWindowEvent.FOCUS_END));
}
}
/**
* 按住窗口标题开始移动时调用
*/
private function dragStart(event:MouseEvent):void
{
if (windowState == FxWindowState.NORMAL)
{
this.startDrag(false, new Rectangle(0, 0, parent.width - this.width, parent.height - this.height));
}
systemManager.addEventListener(MouseEvent.MOUSE_UP , dragStop);
systemManager.stage.addEventListener(Event.MOUSE_L EAVE, dragStop);
}
/**
* 按住窗口标题停止移动时调用
*/
private function dragStop(event:Event):void
{
this.stopDrag();
systemManager.removeEventListener(MouseEvent.MOUSE _UP, dragStop);
systemManager.stage.removeEventListener(Event.MOUS E_LEAVE, dragStop);
}
/**
* 派发最小化事件
*/
private function minimize(event:MouseEvent):void
{
dispatchEvent(new FxWindowEvent(FxWindowEvent.MINIMIZE));
}
/**
* 窗口向下还原时调用
*/
private function restore():void
{
if (windowState == FxWindowState.MAXIMIZED)
{
this.x=this.normalX;
this.y=this.normalY;
this.width=this.normalWidth;
this.height=this.normalHeight;
windowState=FxWindowState.NORMAL;
restoreButton.visible=false;
restoreButton.enabled=false;
maximizeButton.visible=true;
maximizeButton.enabled=true;
dispatchEvent(new FxWindowEvent(FxWindowEvent.RESTORE));
}
}
/**
* 窗口最大化时调用
*/
private function maximize():void
{
if (windowState == FxWindowState.NORMAL)
{
normalX=this.x;
normalY=this.y;
normalHeight=this.height;
normalWidth=this.width;
this.x=0;
this.y=0;
this.percentHeight=100;
this.percentWidth=100;
windowState=FxWindowState.MAXIMIZED;
maximizeButton.visible=false;
maximizeButton.enabled=false;
restoreButton.visible=true;
restoreButton.enabled=true;
dispatchEvent(new FxWindowEvent(FxWindowEvent.MAXIMIZE));
}
}
/**
* 派发关闭事件
*/
private function close(event:MouseEvent):void
{
dispatchEvent(new FxWindowEvent(FxWindowEvent.CLOSE));
}
/**
* 在窗口标题双击时调用
*/
private function titleDoubleClick(event:MouseEvent):void
{
if (windowState == FxWindowState.NORMAL)
{
maximize();
}
else
{
restore();
}
}
/**
* 窗口尺寸改变时调用
*/
private function resize(event:Event):void
{
dragAmountX=parent.mouseX - dragStartMouseX;
dragAmountY=parent.mouseY - dragStartMouseY;
if (currentResizeHandle == topResizeButton && parent.mouseY > 0)
{
this.y=Math.min(savedWindowRect.y + dragAmountY, dragMaxY);
this.height=Math.max(savedWindowRect.height - dragAmountY, this.skin.minHeight);
}
else if (currentResizeHandle == rightResizeButton)
{
this.width=Math.max(savedWindowRect.width + dragAmountX, this.skin.minWidth);
}
else if (currentResizeHandle == bottomResizeButton && parent.mouseY 0)
{
this.x=Math.min(savedWindowRect.x + dragAmountX, dragMaxX);
this.width=Math.max(savedWindowRect.width - dragAmountX, this.skin.minWidth);
}
else if (currentResizeHandle == topLeftResizeButton && parent.mouseX > 0 && parent.mouseY > 0)
{
this.x=Math.min(savedWindowRect.x + dragAmountX, dragMaxX);
this.y=Math.min(savedWindowRect.y + dragAmountY, dragMaxY);
this.width=Math.max(savedWindowRect.width - dragAmountX, this.skin.minWidth);
this.height=Math.max(savedWindowRect.height - dragAmountY, this.skin.minHeight);
}
else if (currentResizeHandle == topRightResizeButton && parent.mouseX 0)
{
this.y=Math.min(savedWindowRect.y + dragAmountY, dragMaxY);
this.width=Math.max(savedWindowRect.width + dragAmountX, this.skin.minWidth);
this.height=Math.max(savedWindowRect.height - dragAmountY, this.skin.minHeight);
}
else if (currentResizeHandle == bottomRightResizeButton && parent.mouseX 0 && parent.mouseY < parent.height)
{
this.x=Math.min(savedWindowRect.x + dragAmountX, dragMaxX);
this.width=Math.max(savedWindowRect.width - dragAmountX, this.skin.minWidth);
this.height=Math.max(savedWindowRect.height + dragAmountY, this.skin.minHeight);
}
}
/**
* 在窗口边缘并按下鼠标左键时调用
*/
private function resizeButtonDown(event:MouseEvent):void
{
if (windowState == FxWindowState.NORMAL)
{
currentResizeHandle=event.target as Button;
setCursor(currentResizeHandle);
dragStartMouseX=parent.mouseX;
dragStartMouseY=parent.mouseY;
savedWindowRect=new Rectangle(this.x, this.y, this.width, this.height);
dragMaxX=savedWindowRect.x + (savedWindowRect.width - this.skin.minWidth);
dragMaxY=savedWindowRect.y + (savedWindowRect.height - this.skin.minHeight);
systemManager.addEventListener(Event.ENTER_FRAME, resize);
systemManager.addEventListener(MouseEvent.MOUSE_UP , resizeButtonRelease);
systemManager.stage.addEventListener(Event.MOUSE_L EAVE, resizeButtonRelease);
}
}
/**
* 在窗口边缘并弹开鼠标左键时调用
*/
private function resizeButtonRelease(event:MouseEvent):void
{
currentResizeHandle=null;
systemManager.removeEventListener(Event.ENTER_FRAM E, resize);
systemManager.removeEventListener(MouseEvent.MOUSE _UP, resizeButtonRelease);
systemManager.stage.removeEventListener(Event.MOUS E_LEAVE, resizeButtonRelease);
CursorManager.removeAllCursors();
}
/**
* 在窗口边缘并鼠标离开时调用
*/
private function resizeButtonRollOut(event:MouseEvent):void
{
if (!event.buttonDown)
CursorManager.removeAllCursors();
}
/**
* 在窗口边缘并鼠标进入时调用
*/
private function resizeButtonRollOver(event:MouseEvent):void
{
if (windowState == FxWindowState.NORMAL)
{
if (!event.buttonDown)
{
setCursor(event.target as Button);
}
}
}
/**
* 鼠标经过窗口边缘时设置鼠标显示形状
*/
private function setCursor(target:Button):void
{
switch (target)
{
case topResizeButton:
case bottomResizeButton:
CursorManager.setCursor(DEFAULT_RESIZE_CURSOR_VERT ICAL, 2, -10, -10);
break;
case rightResizeButton:
case leftResizeButton:
CursorManager.setCursor(DEFAULT_RESIZE_CURSOR_HORI ZONTAL, 2, -10, -10);
break;
case topLeftResizeButton:
case bottomRightResizeButton:
CursorManager.setCursor(DEFAULT_RESIZE_CURSOR_TL_B R, 2, -10, -10);
break;
case topRightResizeButton:
case bottomLeftResizeButton:
CursorManager.setCursor(DEFAULT_RESIZE_CURSOR_TR_B L, 2, -10, -10);
break;
}
}
/**
* 窗口初始化时调用该函数加载皮肤
*/
override protected function partAdded(partName:String, instance:Object):void
{
super.partAdded(partName, instance);
if (instance == titleDisplay)
{
if(dragable)
{
titleDisplay.addEventListener(MouseEvent.MOUSE_DOW N, dragStart);
titleDisplay.addEventListener(MouseEvent.MOUSE_UP, dragStop);
}
if(maximizable)
{
titleDisplay.addEventListener(MouseEvent.DOUBLE_CL ICK, titleDoubleClick);
}
}
if (instance == closeButton)
{
if(closable)
{
closeButton.addEventListener(MouseEvent.CLICK, close);
}
else
{
closeButton.visible=false;
closeButton.enabled=false;
}
}
if (instance == maximizeButton)
{
if(maximizable)
{
maximizeButton.addEventListener(MouseEvent.CLICK, titleDoubleClick);
}
else
{
maximizeButton.visible=false;
maximizeButton.enabled=false;
}
}
if (instance == restoreButton)
{
restoreButton.visible=false;
restoreButton.enabled=false;
if(maximizable)
{
restoreButton.addEventListener(MouseEvent.CLICK, titleDoubleClick);
}
}
if (instance == minimizeButton)
{
if(minimizable)
{
minimizeButton.addEventListener(MouseEvent.CLICK, minimize);
}
else
{
minimizeButton.visible=false;
minimizeButton.enabled=false;
}
}
if (instance == topResizeButton)
{
if(resizable)
{
topResizeButton.addEventListener(MouseEvent.ROLL_O VER, resizeButtonRollOver);
topResizeButton.addEventListener(MouseEvent.MOUSE_ DOWN, resizeButtonDown);
topResizeButton.addEventListener(MouseEvent.ROLL_O UT, resizeButtonRollOut);
}
else
{
topResizeButton.visible=false;
topResizeButton.enabled=false;
}
}
if (instance == bottomResizeButton)
{
if(resizable)
{
bottomResizeButton.addEventListener(MouseEvent.ROL L_OVER, resizeButtonRollOver)
bottomResizeButton.addEventListener(MouseEvent.MOU SE_DOWN, resizeButtonDown)
bottomResizeButton.addEventListener(MouseEvent.ROL L_OUT, resizeButtonRollOut)
}
else
{
bottomResizeButton.visible=false;
bottomResizeButton.enabled=false;
}
}
if (instance == leftResizeButton)
{
if(resizable)
{
leftResizeButton.addEventListener(MouseEvent.ROLL_ OVER, resizeButtonRollOver);
leftResizeButton.addEventListener(MouseEvent.MOUSE _DOWN, resizeButtonDown);
leftResizeButton.addEventListener(MouseEvent.ROLL_ OUT, resizeButtonRollOut);
}
else
{
leftResizeButton.visible=false;
leftResizeButton.enabled=false;
}
}
if (instance == rightResizeButton)
{
if(resizable)
{
rightResizeButton.addEventListener(MouseEvent.ROLL _OVER, resizeButtonRollOver)
rightResizeButton.addEventListener(MouseEvent.MOUS E_DOWN, resizeButtonDown)
rightResizeButton.addEventListener(MouseEvent.ROLL _OUT, resizeButtonRollOut)
}
else
{
rightResizeButton.visible=false;
rightResizeButton.enabled=false;
}
}
if (instance == topLeftResizeButton)
{
if(resizable)
{
topLeftResizeButton.addEventListener(MouseEvent.RO LL_OVER, resizeButtonRollOver)
topLeftResizeButton.addEventListener(MouseEvent.MO USE_DOWN, resizeButtonDown)
topLeftResizeButton.addEventListener(MouseEvent.RO LL_OUT, resizeButtonRollOut)
}
else
{
topLeftResizeButton.visible=false;
topLeftResizeButton.enabled=false;
}
}
if (instance == topRightResizeButton)
{
if(resizable)
{
topRightResizeButton.addEventListener(MouseEvent.R OLL_OVER, resizeButtonRollOver);
topRightResizeButton.addEventListener(MouseEvent.M OUSE_DOWN, resizeButtonDown);
topRightResizeButton.addEventListener(MouseEvent.R OLL_OUT, resizeButtonRollOut);
}
else
{
topRightResizeButton.visible=false;
topRightResizeButton.enabled=false;
}
}
if (instance == bottomLeftResizeButton)
{
if(resizable)
{
bottomLeftResizeButton.addEventListener(MouseEvent .ROLL_OVER, resizeButtonRollOver);
bottomLeftResizeButton.addEventListener(MouseEvent .MOUSE_DOWN, resizeButtonDown);
bottomLeftResizeButton.addEventListener(MouseEvent .ROLL_OUT, resizeButtonRollOut);
}
else
{
bottomLeftResizeButton.visible=false;
bottomLeftResizeButton.enabled=false;
}
}
if (instance == bottomRightResizeButton)
{
if(resizable)
{
bottomRightResizeButton.addEventListener(MouseEven t.ROLL_OVER, resizeButtonRollOver);
bottomRightResizeButton.addEventListener(MouseEven t.MOUSE_DOWN, resizeButtonDown);
bottomRightResizeButton.addEventListener(MouseEven t.ROLL_OUT, resizeButtonRollOut);
}
else
{
bottomRightResizeButton.visible=false;
bottomRightResizeButton.enabled=false;
}
}
}
/**
* 窗口销毁时调用该函数卸载皮肤
*/
override protected function partRemoved(partName:String, instance:Object):void
{
super.partRemoved(partName, instance);
if (instance == titleDisplay)
{
titleDisplay.removeEventListener(MouseEvent.MOUSE_ DOWN, dragStart);
titleDisplay.removeEventListener(MouseEvent.MOUSE_ UP, dragStop);
titleDisplay.removeEventListener(MouseEvent.DOUBLE _CLICK, titleDoubleClick)
}
if (instance == closeButton)
{
closeButton.removeEventListener(MouseEvent.CLICK, close);
}
if (instance == restoreButton)
{
restoreButton.removeEventListener(MouseEvent.CLICK , maximize);
}
if (instance == maximizeButton)
{
maximizeButton.removeEventListener(MouseEvent.CLIC K, titleDoubleClick);
}
if (instance == minimizeButton)
{
minimizeButton.removeEventListener(MouseEvent.CLIC K, minimize);
}
if (instance == topResizeButton)
{
topResizeButton.removeEventListener(MouseEvent.ROL L_OVER, resizeButtonRollOver)
topResizeButton.removeEventListener(MouseEvent.MOU SE_DOWN, resizeButtonDown)
topResizeButton.removeEventListener(MouseEvent.ROL L_OUT, resizeButtonRollOut)
}
if (instance == bottomResizeButton)
{
bottomResizeButton.removeEventListener(MouseEvent. ROLL_OVER, resizeButtonRollOver)
bottomResizeButton.removeEventListener(MouseEvent. MOUSE_DOWN, resizeButtonDown)
bottomResizeButton.removeEventListener(MouseEvent. ROLL_OUT, resizeButtonRollOut)
}
if (instance == leftResizeButton)
{
leftResizeButton.removeEventListener(MouseEvent.RO LL_OVER, resizeButtonRollOver)
leftResizeButton.removeEventListener(MouseEvent.MO USE_DOWN, resizeButtonDown)
leftResizeButton.removeEventListener(MouseEvent.RO LL_OUT, resizeButtonRollOut)
}
if (instance == rightResizeButton)
{
rightResizeButton.removeEventListener(MouseEvent.R OLL_OVER, resizeButtonRollOver)
rightResizeButton.removeEventListener(MouseEvent.M OUSE_DOWN, resizeButtonDown)
rightResizeButton.removeEventListener(MouseEvent.R OLL_OUT, resizeButtonRollOut)
}
if (instance == topLeftResizeButton)
{
topLeftResizeButton.removeEventListener(MouseEvent .ROLL_OVER, resizeButtonRollOver)
topLeftResizeButton.removeEventListener(MouseEvent .MOUSE_DOWN, resizeButtonDown)
topLeftResizeButton.removeEventListener(MouseEvent .ROLL_OUT, resizeButtonRollOut)
}
if (instance == topRightResizeButton)
{
topRightResizeButton.removeEventListener(MouseEven t.ROLL_OVER, resizeButtonRollOver)
topRightResizeButton.removeEventListener(MouseEven t.MOUSE_DOWN, resizeButtonDown)
topRightResizeButton.removeEventListener(MouseEven t.ROLL_OUT, resizeButtonRollOut)
}
if (instance == bottomLeftResizeButton)
{
bottomLeftResizeButton.removeEventListener(MouseEv ent.ROLL_OVER, resizeButtonRollOver)
bottomLeftResizeButton.removeEventListener(MouseEv ent.MOUSE_DOWN, resizeButtonDown)
bottomLeftResizeButton.removeEventListener(MouseEv ent.ROLL_OUT, resizeButtonRollOut)
}
if (instance == bottomRightResizeButton)
{
bottomRightResizeButton.removeEventListener(MouseE vent.ROLL_OVER, resizeButtonRollOver)
bottomRightResizeButton.removeEventListener(MouseE vent.MOUSE_DOWN, resizeButtonDown)
bottomRightResizeButton.removeEventListener(MouseE vent.ROLL_OUT, resizeButtonRollOut)
}
}
private function get windowState():int
{
return _windowState;
}
private function set windowState(windowState:int):void
{
_windowState=windowState;
}
}
}