настройка области содержимого в пользовательском компоненте flex

Question

Я пытаюсь определить область содержимого пользовательского компонента, который расширяет mx: VBox. Компонент имеет предопределенные верхние и нижние колонтитулы (визуальные дети), и я хочу установить область посередине для добавления детей к компоненту. Компонент будет использоваться следующим образом:

<custom_component> 
    <mx:button/> 
</custom_component> 

Как бы установить эту область содержимого?

Answer 1

Там на самом деле несколько шагов к нему.

1. Ваш пользовательский компонент должен установить метаданные DefaultProperty, чтобы дети не сталкивались с теми, что находятся внутри самого настраиваемого компонента.
2. Затем вам нужно убрать их в экземпляре var для добавления в область содержимого позже, потому что свойства будут установлены до того, как будут созданы дочерние компоненты.
3. Наконец, если несколько детей указаны ваши DefaultProperty будет передан объект Array (а не одного UIComponent экземпляра.)

Так что ваш пользовательский компонент будет выглядеть примерно так:

<?xml version="1.0" encoding="utf-8"?> 
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300"> 
    <mx:Metadata> 
     [DefaultProperty("content")] 
    </mx:Metadata> 

    <mx:HBox id="headerBox"/> 
    <mx:VBox id="contentBox"/> 
    <mx:HBox id="footerBox"/> 

    <mx:Script> 
     <![CDATA[ 
      import mx.core.UIComponent; 
      private var _contentChildren:Array; 

      public function set content(c:*) : void { 
       // Allow 1 or more children to be specified 
       _contentChildren = (c as Array) || [c]; 
      } 

      override protected function createChildren() : void { 
       // Call super so contentBox gets created first 
       super.createChildren(); 

       for each (var child:UIComponent in _contentChildren) { 
        contentBox.addChild(child); 
       } 
      } 
     ]]> 
    </mx:Script> 
</mx:VBox> 

Answer 2

Попробуйте использовать холст?

Answer 3

В пользовательском компоненте, добавьте тег DefaultProperty метаданных:

[DefaultProperty("nameOfDefaultProperty")] 

Тогда вы бы также определить сеттер для этого свойства:

public function set nameOfDefaultProperty(value:UIComponent):void 
{ 
    if (value != null) 
    { 
     // add "value" to the display list here 
    } 
}