Alguém conhece um exemplo de Vbox de várias colunas?

Question

Apenas imaginando se alguém sabe de um exemplo por aí, ou aula que eu posso adicionar ao meu aplicativo que funcionaria como um Vbox, mas com 2 ou mais colunas?

Estou adicionando itens a um Vbox de um loop, e isso funciona bem, mas quero dividi -lo em duas colunas:

 _________________
|        |        |
| Item 1 | Item 2 |
| Item 3 | Item 4 |
| Item 5 |        |
|________|________|

Por enquanto, vou definir 2 Vboxes lado a lado e atribuir itens ímpares a um e até para o outro, mas seria bom ter um controle, faça isso automaticamente.

EDITAR
Por favor, pare de me dar um trabalho. Eu já tenho um trabalho funcional por aí. Mas se você já escreveu uma aula que faz isso ou sabe onde posso encontrar uma online, eu realmente apreciaria. Obrigado

Answer 1

flexlib (http://code.google.com/p/flexlib/) possui um adorável controle de contêiner de contêiner de fluxo que fará exatamente o que você precisa.

Answer 2

Colocá -los em um Hbox?

Answer 3

Você pode usar um Vbox contendo um Hbox para cada linha e simplesmente preencher cada Hbox com 2 itens, algo como:

var vb: vBox;
var Array_of_items: Array;

para (var i: int = 0; i <array_of_items.length; i+= 2)
{
var hb: hbox = new hbox ();
hb.addchild (array_of_items [i]);
hb.addchild (array_of_items [i+1]);
vb.addchild (HB);
}

Answer 4

Fiz algo semelhante a isso com um hbox e 2 formas, o que alinha as coisas bem. Dinamicamente, você pode alternar a adição de crianças a cada formulário.

Answer 5

Por que não usar apenas o recipiente de ladrilhos e defina a propriedade de direção na direção do fluxo necessária?

Answer 6

Eu mesmo tive um problema semelhante. Foi isso que acabei usando:

package {
    import mx.containers.HBox;
    import mx.containers.VBox;
    import mx.events.FlexEvent;

    public class MultiColumnVBox extends HBox {
        // public properties
        public var columnWidth:int;
        public var verticalGap:int;
        public var adjustForScrollbar:Boolean;

        public function MultiColumnVBox() {
            super();
            this.addEventListener(FlexEvent.CREATION_COMPLETE, rearrangeChildren);
        }

        private function rearrangeChildren(evtObj:FlexEvent):void {
            // height will change whilst rearranging children, as will the Children Array
            // we store them once at the start
            var myHeight:int = this.height;
            var children:Array = this.getChildren();

            var lastIndex:int = 0;
            var vBoxIndex:int = 0;
            var vBox:VBox;
            var totalHeight:int = -this.verticalGap + (this.adjustForScrollbar ? 16 : 0);

            for(var i:int=0; i<children.length; i++) {
                // resize each child and measure the height
                // if you don't want it resized to the columnWidth, set the maxWidth property
                children[i].width = this.columnWidth;
                children[i].validateSize();
                totalHeight += children[i].measuredHeight + this.verticalGap;
                // if we're too tall, or we've reached the last element, move them into a VBox
                if(totalHeight > myHeight || i == children.length-1) {
                    vBox = new VBox();
                    vBox.setStyle("verticalGap", this.verticalGap);
                    vBox.width = this.columnWidth;
                    // include last child if there is room
                    for(var j:int=lastIndex; j<(totalHeight > myHeight ? i : i+1); j++) {
                        vBox.addChild(children[j]);
                    }
                    this.addChildAt(vBox, vBoxIndex);
                    vBoxIndex += 1;
                    lastIndex = i;
                    totalHeight = -this.verticalGap + (this.adjustForScrollbar ? 16 : 0);
                }
            }
        }
    }
}

O resultado final é um pouco diferente, no entanto. Em vez de mover as crianças para colunas alternadas, ela preenche a altura da primeira coluna, depois a segunda, depois a terceira, etc.

Se você planeja fazer de nossa classe, como você disse, uma abordagem semelhante deve funcionar: aguardando o evento Creation_Complete e reorganizando as crianças em dois controles Vbox.

Answer 7

Eu acho que o recipiente de ladrilhos com direção = "horizontal" fará isso