Кто-нибудь знает об примере Vbox Multi-Column?

Question

Просто удивляюсь, если кто-нибудь знает из примера там, или класс, который я могу добавить в свое приложение, которое будет работать как VBOX, но с 2 или более столбцами?

Я добавляю товары в VBOX из цикла, и это отлично работает, но я хочу, чтобы он разделился на два столбца:

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

На данный момент я просто собираюсь установить 2 Vboxes бок о бок и назначить нечетные предметы к одному, и даже на другую, но было бы неплохо иметь контроль сделать это автоматически.

РЕДАКТИРОВАТЬ
Пожалуйста, перестань дать мне работу вокруг. У меня уже есть функциональная работа. Но если вы уже написали класс, который делает это или знать, где я могу найти один онлайн, я бы очень признателен. Спасибо

Answer 1

FlexLib (http://code.google.com/p/flexlib/) имеет прекрасный контроль контейнера FlowContainer, который будет делать именно то, что вам нужно.

Answer 2

положить их в габс?

Answer 3

Вы можете использовать VBOX, содержащий HBOX для каждой строки и просто заполните каждый HBOX с 2 элементами, что-то вроде:

var vb: vbox;
var array_of_items: массив;

для (var i: int = 0; i <array_of_items.length; i + = 2)
{
var hb: hbox = новый hbox ();
hb.addchild (array_of_items [i]);
hb.addchild (array_of_items [i + 1]);
vb.addchild (HB);
}

Answer 4

Я сделал что-то похожее на это с помощью Hbox и 2 формы, которые красиво строятся. Динамически вы можете чередовать добавлять детей в каждую форму.

Answer 5

Почему бы не просто использовать контейнер для плитки, и установите свойство направления на ваш необходимый направление потока?

Answer 6

У меня была похожая проблема сам. Это то, что я закончил использовать:

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);
                }
            }
        }
    }
}

Однако конечный результат немного отличается. Вместо того, чтобы двигаться детей в чередующиеся колонны, он заполняет высоту первой колонны, затем второй, затем третий и т. Д.

Если вы планируете сделать свой класс, как вы уже говорили, аналогичный подход должен работать: ждет событие CORSET_COMPLETE, а затем переставив детей в два элемента управления VBox.

Answer 7

Я думаю, что контейнер для плитки с направлением = "горизонтальный" сделает это