Subclassing component hides base class visual elements. How can I imlpement visual inheritance?

I have the following problem:

• I have a class A th开发者_运维技巧at extends s:Panel.

• I have a class B that extends A

  <!-- Class A -->
  <s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" >
  
     <s:Label text="A" />
  </s:Panel>
  
  <!-- Class B -->
  <controls:A  >
     <s:Label text="B" alpha="0.3" />
  </controls:A>
  

my intuition tells me that both texts should be shown, but I cannot make the text in A show.

thanks,

You can't add children twice to UIComponent. So Class A extends Panel, and adds a label to children array inside the Panel instance. And B extends A, but you can't add more children again. This is just a limitation of MXML. In theory you could do this, but Flex will throw an exception when you do this.

However, there are ways to work around this. You have to plan for this type of extension in Flex when designing the base class. This referred to a Template Component. The base class will serve as the template that will allow subclasses to specify pieces of the UI and the base class will wrap around those components. Overall I find this technique very important for creating reusable views that other users can be customize.

Check out this article on how you might do this: http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf68a49-7ffa.html

You can even add metadata [DefaultProperty] metadata tag to the base class so your users have the illusion they are adding to the children array just like default MXML does.

http://dispatchevent.org/mims/flex-manual-blues/