在自定義柔性組件中設置內容區域

Question

我正在嘗試定義擴展mx：VBox的自定義組件的內容區域。該組件具有預定義的頁眉和頁腳（可視化子項），我想設置中間區域以將子項添加到組件。該組件將如下使用：

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

如何設置此內容區域？

Answer 1

有實際上是幾步就到了。

1. 您的自定義組件需要設置其DefaultProperty元數據，以便孩子不會與自定義組件本身發生衝突。
2. 然後，您需要將它們收藏在實例var中以便稍後添加到您的內容區域，因爲這些屬性將在創建子組件之前設置。
3. 最後，如果有多個孩子被指定的DefaultProperty將交由一個數組對象（而不是單個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")] 

然後，你還要定義一個setter該屬性：

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