Flex:在PANEL的title上加一个button
在panel的titleBar上添加按钮,首先 override createChildren方法, 其中加入panel.rawChildren.addChild(Button),然后override panel的layoutChrome方法定置按钮的位置。
例子如下:
001 package{
002???? import mx.containers.Panel;
003???? import mx.controls.Button;
004???? import flash.events.Event;
005???? import flash.events.MouseEvent;
006???? import flash.display.DisplayObject;
007???? import mx.effects.Resize;
008???? import mx.controls.Alert;
009???? import mx.controls.Label;
010???
011???? [Event(name="restore")]
012???? [Event(name="maximize")]
013???
014???? public class FlexPanel extends Panel{
015???????? private var state:int = 0;
016???????????????
017???????? private var restoreBtn: Button;
018???????? private var minBtn: Button;
019???????? private var closeBtn: Button;
020??????????
021???????? [Embed("../assets/minICON.png")] // 这里我自定义了按钮外观
022???????? private var minIcon:Class;
023???????? [Embed("../assets/minOverICON.png")]
024???????? private var minOverIcon:Class;
025??????????
026???????? [Embed("../assets/restoreICON.png")]
027???????? private var restoreIcon:Class;
028???????? [Embed("../assets/restoreOverICON.png")]
029???????? private var restoreOverIcon:Class;
030??????????
031???????? [Embed("../assets/closeICON.png")]
032???????? private var closeIcon:Class;
033???????? [Embed("../assets/closeOverICON.png")]
034???????? private var closeOverIcon:Class;
035??????????
036???????? private var resize: Resize;?????
037???????? private var effectTime: Number = 400;
038????????????
039???????? private static var _instance: FlexPanel;
040??????????
041???????? public function FlexPanel(){
042???????????? super();
043???????????? _instance = this;??
044???????? }
045??????????
046???????? public override function initialize():void{
047???????????? super.initialize();
048???????????? this.maxHeight = this.height;
049???????????? initEffect();
050???????? }
051??????????
052???????? private function setState(state:int):void{
053???????????? this.state=state;
054???????????? if (state==0){
055???????????????? this.dispatchEvent(new Event('restore'));
056???????????? } else {
057???????????????? this.dispatchEvent(new Event('maximize'));
058???????????? }
059???????? }
060???????? /* ************************************************* */
061???????? protected override function createChildren(): void {
062???????????? super.createChildren();
063?????????????
064???????????? this.titleBar.addEventListener(MouseEvent.MOUSE_DOWN, doDrag);
065???????????? this.titleBar.addEventListener(MouseEvent.MOUSE_UP, doDrop);
066?????????????
067???????????? restoreBtn = new Button();
068???????????? restoreBtn.addEventListener("click",doRestore);????????
069???????????? restoreBtn.setStyle("overIcon",restoreOverIcon);
070???????????? restoreBtn.setStyle("downIcon",restoreIcon);
071???????????? restoreBtn.setStyle("upIcon",restoreIcon);????????
072???????????? restoreBtn.visible=false;
073???????????? rawChildren.addChild(restoreBtn);??
074?????????????
075???????????? minBtn = new Button();
076???????????? minBtn.addEventListener("click",doMin);
077???????????? minBtn.setStyle("overIcon",minOverIcon);
078???????????? minBtn.setStyle("downIcon",minIcon);
079???????????? minBtn.setStyle("upIcon",minIcon);
080???????????? minBtn.visible = true;
081???????????? rawChildren.addChild(minBtn);
082?????????????
083???????????? closeBtn = new Button();
084???????????? closeBtn.addEventListener("click",doClose);
085???????????? closeBtn.setStyle("overIcon",closeOverIcon);
086???????????? closeBtn.setStyle("downIcon",closeIcon);
087???????????? closeBtn.setStyle("upIcon",closeIcon);
088???????????? closeBtn.visible = true;
089???????????? rawChildren.addChild(closeBtn);????????
090?????????????
091???????? }
092???????? /* ************************************************** */
093???????? protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
094???????????? super.updateDisplayList(unscaledWidth, unscaledHeight);????????????
095???????? }
096??????????
097???????? private function doMin(event:Event):void{
098???????????? setState(1);
099???????????? minBtn.visible= false;
100???????????? restoreBtn.visible= true;
101???????????? minEffect();
102???????????? //Alert.show(this.verticalScrollBar.toString());
103???????? }
104???????????
105???????? private function doRestore(event:Event) :void{
106???????????? setState(0);
107???????????? minBtn.visible= true;
108???????????? restoreBtn.visible= false;
109???????????? restoreEffect();
110???????? }
111??????????
112???????? private function doClose(event:Event) :void{
113???????????? this.visible = false;
114???????????? this.parent.removeChild(this);
115???????? }
116??????????
117???????? private function doDrag(event:Event):void{
118???????????? this.startDrag();????????
119???????? }
120??????????
121???????? private function doDrop(event:Event):void{
122???????????? this.stopDrag();????????
123???????? }
124???????? /* ********************************************************************************* */
125???????? protected override function layoutChrome(unscaledWidth: Number, unscaledHeight:Number):void {
126???????????? super.layoutChrome(unscaledWidth, unscaledHeight);
127?????????????
128???????????? var margin:int = 0;
129???????????? var pixelsFromTop:int = 6;
130???????????? var pixelsFromRight:int = 12;
131???????????? var buttonWidth:int = 18;
132???????????? var buttonHeight:int = 17;
133???????????? var distance:int = 7;
134???????????? var x:Number = this.width - buttonWidth*2 - distance - pixelsFromRight;
135???????????? var y:Number = pixelsFromTop;
136?????????????
137???????????? restoreBtn.setActualSize(buttonWidth, buttonHeight);
138???????????? restoreBtn.move(x,y);
139?????????????
140???????????? minBtn.setActualSize(buttonWidth, buttonHeight);
141???????????? minBtn.move(x,y);
142?????????????
143???????????? closeBtn.setActualSize(buttonWidth, buttonHeight);
144???????????? closeBtn.move(this.width - buttonWidth - pixelsFromRight,y);
145?????????????
146???????? }
147???????? /* ********************************************************************************* */
148???????? private function initEffect():void{????????
149???????????? resize = new Resize(_instance);
150???????????? resize.heightTo = this.titleBar.height;
151???????????? resize.duration = effectTime;
152???????? }
153??????????
154???????? private function minEffect():void{
155???????????? resize.heightTo = this.titleBar.height;
156???????????? resize.end();
157???????????? resize.play();
158???????? }
159??????????
160???????? private function restoreEffect():void{
161???????????? resize.heightTo = this.maxHeight;
162???????????? resize.end();
163???????????? resize.play();
164???????? }
165???? }
166 }
看到这么长的代码不要觉得可怕,这是我自己用的panel,懒得简化了干脆直接把代码全帖出来,你只需要注意开带*号的地方就可以了