随笔- 13 文章- 0 评论- 7 阅读- 19008

在panel的titleBar上添加按钮，首先 override createChildren方法, 其中加入panel.rawChildren.addChild(Button)，然后override panel的layoutChrome方法定置按钮的位置。
例子如下：

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

package{
    import mx.containers.Panel;
    import mx.controls.Button;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.display.DisplayObject;
    import mx.effects.Resize;
    import mx.controls.Alert;
    import mx.controls.Label;
 
    [Event(name="restore")]
    [Event(name="maximize")]
 
    public class FlexPanel extends Panel{
        private var state:int = 0;
             
        private var restoreBtn: Button;
        private var minBtn: Button;
        private var closeBtn: Button;
        
        [Embed("../assets/minICON.png")] // 这里我自定义了按钮外观
        private var minIcon:Class;
        [Embed("../assets/minOverICON.png")]
        private var minOverIcon:Class;
        
        [Embed("../assets/restoreICON.png")]
        private var restoreIcon:Class;
        [Embed("../assets/restoreOverICON.png")]
        private var restoreOverIcon:Class;
        
        [Embed("../assets/closeICON.png")]
        private var closeIcon:Class;
        [Embed("../assets/closeOverICON.png")]
        private var closeOverIcon:Class;
        
        private var resize: Resize;    
        private var effectTime: Number = 400;
          
        private static var _instance: FlexPanel;
        
        public function FlexPanel(){
            super();
            _instance = this; 
        }
        
        public override function initialize():void{
            super.initialize();
            this.maxHeight = this.height;
            initEffect();
        }
        
        private function setState(state:int):void{
            this.state=state;
            if (state==0){
                this.dispatchEvent(new Event('restore'));
            } else {
                this.dispatchEvent(new Event('maximize'));
            }
        }
        /* ************************************************* */
        protected override function createChildren(): void {
            super.createChildren();
           
            this.titleBar.addEventListener(MouseEvent.MOUSE_DOWN, doDrag);
            this.titleBar.addEventListener(MouseEvent.MOUSE_UP, doDrop);
           
            restoreBtn = new Button();
            restoreBtn.addEventListener("click",doRestore);       
            restoreBtn.setStyle("overIcon",restoreOverIcon);
            restoreBtn.setStyle("downIcon",restoreIcon);
            restoreBtn.setStyle("upIcon",restoreIcon);       
            restoreBtn.visible=false;
            rawChildren.addChild(restoreBtn); 
           
            minBtn = new Button();
            minBtn.addEventListener("click",doMin);
            minBtn.setStyle("overIcon",minOverIcon);
            minBtn.setStyle("downIcon",minIcon);
            minBtn.setStyle("upIcon",minIcon);
            minBtn.visible = true;
            rawChildren.addChild(minBtn);
           
            closeBtn = new Button();
            closeBtn.addEventListener("click",doClose);
            closeBtn.setStyle("overIcon",closeOverIcon);
            closeBtn.setStyle("downIcon",closeIcon);
            closeBtn.setStyle("upIcon",closeIcon);
            closeBtn.visible = true;
            rawChildren.addChild(closeBtn);       
           
        }
        /* ************************************************** */
        protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
            super.updateDisplayList(unscaledWidth, unscaledHeight);           
        }
        
        private function doMin(event:Event):void{
            setState(1);
            minBtn.visible= false;
            restoreBtn.visible= true;
            minEffect();
            //Alert.show(this.verticalScrollBar.toString());
        }
         
        private function doRestore(event:Event) :void{
            setState(0);
            minBtn.visible= true;
            restoreBtn.visible= false;
            restoreEffect();
        }
        
        private function doClose(event:Event) :void{
            this.visible = false;
            this.parent.removeChild(this);
        }
        
        private function doDrag(event:Event):void{
            this.startDrag();       
        }
        
        private function doDrop(event:Event):void{
            this.stopDrag();       
        }
        /* ********************************************************************************* */
        protected override function layoutChrome(unscaledWidth: Number, unscaledHeight:Number):void {
            super.layoutChrome(unscaledWidth, unscaledHeight);
           
            var margin:int = 0;
            var pixelsFromTop:int = 6;
            var pixelsFromRight:int = 12;
            var buttonWidth:int = 18;
            var buttonHeight:int = 17;
            var distance:int = 7;
            var x:Number = this.width - buttonWidth*2 - distance - pixelsFromRight;
            var y:Number = pixelsFromTop;
           
            restoreBtn.setActualSize(buttonWidth, buttonHeight);
            restoreBtn.move(x,y);
           
            minBtn.setActualSize(buttonWidth, buttonHeight);
            minBtn.move(x,y);
           
            closeBtn.setActualSize(buttonWidth, buttonHeight);
            closeBtn.move(this.width - buttonWidth - pixelsFromRight,y);
           
        }
        /* ********************************************************************************* */
        private function initEffect():void{       
            resize = new Resize(_instance);
            resize.heightTo = this.titleBar.height;
            resize.duration = effectTime;
        }
        
        private function minEffect():void{
            resize.heightTo = this.titleBar.height;
            resize.end();
            resize.play();
        }
        
        private function restoreEffect():void{
            resize.heightTo = this.maxHeight;
            resize.end();
            resize.play();
        }
    }
}