flex的panel 容器titleBar的无限扩展

昨天研究了下，有两个方法http://xo-tobacoo.iteye.com/blog/621811，但是都是静态建立子button，类型。今天想想不对，理论上来说，如果那是一个UI类应该是能无限扩展的，研究了下，胜利实现如下：

1）将子标签包含在panel内，将子类包含在panel内是必须的，不然会因为引用和初始化顺序导致的一系列错误：

<components:PanelMy width="500" height="500" title="ui" myTitleBar="{test}">
 <mx:MenuBar id="test" height="100%"
    dataProvider="{menuXML}" 
    labelField="@label" 
    showRoot="true" />
</components:PanelMy>

 

2）示例PanelMy.as扩展panel类，如下：

package module.procurement.components
{
	import flash.events.MouseEvent;
	
	import mx.containers.Panel;
	import mx.controls.LinkButton;
	import mx.core.UIComponent;
	import flash.display.DisplayObject;
	
	public class PanelMy extends Panel
	{
		var topBar:UIComponent;
		public function PanelMy()
		{
			super();
		}
		
		
		private var maxClick:LinkButton;
		
		private var _myTitleBar:UIComponent;
		public function get myTitleBar():UIComponent
		{
			return _myTitleBar;
		}
		
		/**
		 *  @private
		 */
		public function set myTitleBar(value:UIComponent):void
		{
			_myTitleBar = value;
			invalidateProperties();
			invalidateSize();
		}
		
	
		
		override protected function createChildren():void
		{
			super.createChildren();
			
(MouseEvent.CLICK, toMaxHandler);
			titleBar.addChild(_myTitleBar);
			
		}
		
		override protected function updateDisplayList (unscaledWidth:Number, unscaledHeight:Number):void
		{
			
			super.updateDisplayList(unscaledWidth, unscaledHeight);
			
			_myTitleBar.setActualSize( _myTitleBar.getExplicitOrMeasuredWidth(),
				_myTitleBar.getExplicitOrMeasuredHeight() );
					
		} 

	}
}

 
3)主mxml程序：

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication  xmlns:fx="http://ns.adobe.com/mxml/2009" 
						xmlns:s="library://ns.adobe.com/flex/spark" 
						xmlns:mx="library://ns.adobe.com/flex/halo" xmlns:components="module.procurement.components.*">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>
	<fx:Declarations>
		<fx:XMLList id="menuXML">
			<menuitem label="Customer" data="Customer"/>
			<menuitem label="vendor" data="module/procurement/Vendor" enable="YES"/>
			<menuitem label="Work" data="Work">
				</menuitem>			
		</fx:XMLList>
	</fx:Declarations>
	

<components:PanelMy width="500" height="500" title="ui" myTitleBar="{test}">
	<mx:MenuBar id="test" height="100%"
				dataProvider="{menuXML}" 
				labelField="@label" 
				showRoot="true" />
	
</components:PanelMy>
	
</s:WindowedApplication>

 

 

注：此方法完全可以作为扩展flex官方标签的一个范例，想做其它扩展照葫芦画瓢即可。一切皆有可能啊！