компонент динамического добавления

Question

Я хочу динамически добавить компонент в Контейнер, например, Canvas (ограничения TileList для каждого дочернего элемента имеют одинаковый размер, GridList имеет низкую производительность), например,

<mx:Canvas id="myHolder" width="600" height="550">

</mx:Canvas>
<mx:Button label="Add Button" click="addButton()"/>

когда я нажимаю кнопку, я надеюсь добавить компонент (независимо от того, какой это компонент, и, возможно, каждый компонент имеет разный размер), и, если общая ширина всех добавленных дочерних элементов больше myHolder, я надеюсь, что новый дочерний элемент может начинаться с новой строки и одновременно растягивать высоту myHolder (лучше использовать макет с пользовательским кодом)

Answer 1

На Canvas у вас есть полная свобода для размещения компонентов в любом месте, используя их свойства x и y, так что существует множество способов обрезать эту кошку.Поскольку вам нужны строки, один из методов может быть (не проверен):

//inside of your Canvas-based component
private function updateChildrenPositions():void
{
     var rowY:Number = 0;
     var rowWidth:Number = 0;
     var rowHeight:Number = 0;
     for (var i:int = 0, total:int = numChildren; i < total; i++)
     {
         var child:DisplayObject = getChildAt(i);
         if (rowWidth + child.width > width)
         {
             //child will cause overflow, start next row
             rowY += rowHeight;
             rowWidth = 0;
             rowHeight = 0;
         }
         rowWidth += child.width;
         child.x = rowWidth;
         child.y = rowY;
         if (child.height > rowHeight) rowHeight = child.height; //accumulating max height
     }
     height = rowY + rowHeight;
}

Это предполагает, что Canvas имеет фиксированную ширину и установленную высоту в зависимости от макета.Вы можете добавить отступы и пробелы позже, это хорошее упражнение:)

Answer 2

Чтобы получить желаемую функциональность, я бы не стал использовать HBox.Как предположил alxx, TileList было бы лучше в этой ситуации.

Вот несколько примеров использования TileList для начала:

http://blog.flexexamples.com/category/halo/tilelist/

http://learn.adobe.com/wiki/display/Flex/TileList