继承父类并继承父类的控件

在Flex当中，如果父类已经拥有了子元素，然后你再继承这个父类，并且在子类当中也定义了mxml的标签元素，那么将会只显示子类的mxml标签元素而不会显示父类的mxml标签元素。

当然你可以重写createChildren方法，然后把你要显示的子元素以代码形式添加，这样绝对可以把父类的元素全部继承下来。但是为什么写标签形式就不行呢？

我们仔细窥探一下，发现用mxml标签形式写的时候，flex会把这些标签放通过 mxmlContent的set方法放到一个数组中，然后在createChildren的时候把这个数组中的元素一个一个加到显示列表中。

如果你的子类继承了父类，而且子类也定义了mxml标签，那么当初始化子类的时候，也会调用mxmlContent的方法，这样的话就会把父类的保存父类标签的数组冲掉，导致只会现实子类的标签了。

明白了这些，那我就直接贴代码了。

App：

 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" 
			   minWidth="955" minHeight="600" 
			   xmlns:Vgroup="com.view.Vgroup.*">
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	<Vgroup:ChildVGroup2/>
	<Vgroup:ChildVGroup/>
</s:Application>

 ChildVGroup：

 

<?xml version="1.0" encoding="utf-8"?>
<Vgroup:ParentVGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
				   xmlns:s="library://ns.adobe.com/flex/spark" 
				   xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:Vgroup="com.view.Vgroup.*">
	
	<fx:Script>
		<![CDATA[
			override protected function createChildren():void
			{
				var currentMxmlContent:Array = super.mx_internal::getMXMLContent();
				var allMxmlContentArray:Array = mxmlContentArray.concat(currentMxmlContent);
				mxmlContent = allMxmlContentArray;
				super.createChildren();
			}
		]]>
	</fx:Script>
	<s:Button label="tv3"/>
	<s:Button label="tv4"/>
	<s:Button label="tv5"/>
	<s:Button label="tv6"/>
</Vgroup:ParentVGroup>

  ChildVGroup2 和 ChildGroup 一样，只是button的label不一样，以此来区别。

ParentVGroup：

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
		  xmlns:s="library://ns.adobe.com/flex/spark" 
		  xmlns:mx="library://ns.adobe.com/flex/mx">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			public var mxmlContentArray:Array;//在加载类的时候，第一次会加载Parent的容器的child（例如v1，v2），然后放到这个数组中。
			//在默认的实现当中，如果parent的子类也有child，那么就会覆盖这个数组。所以我们要先把parent的child的保存起来。
			override public function set mxmlContent(value:Array):void
			{
				super.mxmlContent = value;
				if(!mxmlContentArray)
				{
					mxmlContentArray = value;
				}
			}
		]]>
	</fx:Script>
	<s:Button label="v1"/>
	<s:Button label="v2"/>
</s:VGroup>