пользовательский контейнер MXML в Flex 4

Question

Я хочу создать пользовательский контейнер, который можно использовать в MXML, например:

<local:MyContainer>
  <s:Label/>
  <s:Button/>
  ...
</local:MyContainer>

... но я хотел бы иметь возможность отлавливать, когда добавляются дети, чтобы я мог контролировать такие вещи, как, когда и где они добавляются.

Я попытался переопределить addChild (), addChildAt (), addElement (), addElementAt (), (расширение класса Group), но они запускаются только при добавлении элементов специально с этими функциями - приложение запускается и метка, кнопка, и т. д., в конечном итоге в MyContainer без вызова этих функций.

Как я могу контролировать добавление субкомпонентов через MXML? Я не на том пути - я должен вместо этого писать собственный макет и / или скин?

Answer 1

Вы можете попробовать перезаписать установщик mxmlContent-Array .Вероятно, это используется вместо addChild () ...

Answer 2

Я только что узнал, что это работает, и это может быть полезно для вас. У этого есть обратная сторона. Дизайнер отобразит сообщение об ошибке «Для тега указано несколько наборов визуальных дочерних элементов».

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import avmplus.getQualifiedClassName;

            import flash.utils.getDefinitionByName;

            import mx.core.IVisualElement;
            import mx.core.UIComponent;

            import spark.layouts.BasicLayout;
            import spark.layouts.VerticalLayout;

            private var customMxmlContent : Array = null;
            private var customInitializeDone : Boolean = false;
            override public function set mxmlContent(value:Array) : void {

                if(!customInitializeDone) {
                    // customInitializeDone == false:
                    // this is called when the elements that are defined in THIS
                    // mxml file are added to mxmlContent. 
                    super.mxmlContent = value;
                    customInitializeDone = true;

                } else { 
                    // customInitializeDone:
                    // called when the elements from another mxmls file are added.
                    // Another file uses this component in this way:
                    /*
                    <views:RoundedGroup width="100%">
                        <views:layout>
                            <s:VerticalLayout/>
                        </views:layout>

                        <s:Button label="1234" />
                        <s:Button label="5678" />
                    </views:RoundedGroup>
                     */
                    // Here it is redirected to the innerGroup
                    // if you do not do this, the content of THIS mxml file is
                    // replaced by the other content
                    for(var i:uint=0; i < value.length; i++) {
                        innerGroup.addElement(value[i] as IVisualElement);
                    }
                }

                // Reset the layout 
                if(this.layout != null) {
                    // find out the layout class that is applied to this
                    var layClass : Class =  getDefinitionByName(getQualifiedClassName(this.layout)) as Class;
                    // and apply it to innerGroup instead
                    innerGroup.layout = new layClass();
                    // and reset the layout of this to a BasicLayout to get the Rect to the correct
                    // position and the innerGroup above the Rect
                    this.layout = new BasicLayout();
                }
            }
        ]]>
    </fx:Script>

        <s:Rect left="10" right="10" top="10" height="100%"  radiusX="11" radiusY="11">
            <s:fill>
                <s:SolidColor color="0xB7C8A8" />
            </s:fill>
            <s:stroke>
                <s:SolidColorStroke color="0xABABAB" weight="1" />
            </s:stroke>
        </s:Rect>

        <!-- Items are added within set mxmlContent to this VGroup container -->
        <s:Group id="innerGroup" left="10" right="10" top="10" />
</s:Group>