在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>