今天的一个项目中需要在Panel的标题栏中上增加按钮,所以就有这个AdvancedTitleBarPanel了。实现的原理很简单就是扩展mx.containers.Panel,然后在titleBar添加一个UIComponent,源码如下:

package com.eshangrao.containers
{
	import mx.containers.Panel;
	import mx.core.UIComponent;
	import mx.core.EdgeMetrics;
	/**
	 *  A Advanced Panel container consists of a Advanced title bar which you can 
	 *  add every childer to the Panel't titlte Bar
	 *  
	 *  @mxml
	 *  
	 *  <p>The <code>&lt;mx:Panel&gt;</code> tag inherits all of the tag 
	 *  attributes of its superclass and adds the following tag attributes:</p>
	 *  
	 *  <pre>
	 *  &lt;eshangrao:AdvancedTitleBarPanel&gt
	 *   &lt;eshangrao:advancedTitleBar&gt 
	 *      <i>child which wants added to titleBar tags</i>
	 * 	 &lt;/eshangrao:advancedTitleBar&gt	
	 *      ...
	 *      <i>child tags</i>
	 *      ...
	 *  &lt;/eshangrao:AdvancedTilteBarPanel&gt;
	 *  </pre>
	 *  
	 *  @see mx.containers.Panel
	 */
	public class AdvancedTitleBarPanel extends Panel
	{
		 /**
		 *  @public
	     *  the advancedTitleBar,insert into the <code>titleBar</code> after the title
	     *  <code>titleTextField</code>.
	     * 
	     *  <pre>
	     *  &lt;eshangrao:advancedTitleBar&gt 
	 	 *    <i>child which wants added to titleBar tags</i>
	 	 * 	&lt;/eshangrao:advancedTitleBar&gt	
	 	 *  </pre>
	     */
		public var advancedTitleBar:UIComponent;
		
		override protected function createChildren():void{
			super.createChildren();
			
			//if(!advancedTitleBar)
			//	advancedTitleBar=new UIComponent();
			//titleBar.addChild(advancedTitleBar);
			//rawChildren.addChild(titleBar);
			if(!advancedTitleBar){
			advancedTitleBar=new UIComponent();
			}
			titleBar.addChild(advancedTitleBar);
			advancedTitleBar.owner = this;
			
		}
		override protected function layoutChrome(unscaledWidth:Number,unscaledHeight:Number):void{
         	super.layoutChrome(unscaledWidth, unscaledHeight);
         	
         	var bm:EdgeMetrics = borderMetrics;
         	var minX:Number = titleTextField.x + titleTextField.textWidth + 8;            
         	var rightOffset: