Относительная ширина компонентов внутри HBox

Добрый день! Помогите, пожалуйста.
Внутри HBox размещаем, к примеру, четыре VBox’а. Хотим, чтобы первый и последний занимали по 10% ширины родительского HBox’а, второй - 50% и третий 30%.
соответственно, пытаемся VBoxам сделать setWidth(“10%”) ect, но на выходе получаем четыре слота v-slot c width=25%, а уже в них ужатые по нашим процентам VBox (то есть в 10% от слота, а не от родительского hBox). Подскажите, пожалуйста, что надо сделать, чтобы разместить пропорционально?

Добрый день, Виктория.

Вам нужно установить атрибут box.expandRatio, чтобы указать коэффициент расширения каждого компонента в основном контейнере HBox, более подробно можно об этом узнать в документации.

Для вашего случая это:

        <hbox width="100%">
            <vbox width="100%" caption="First" box.expandRatio="1"/>
            <vbox width="100%" caption="Second" box.expandRatio="5"/>
            <vbox width="100%" caption="Third" box.expandRatio="3"/>
            <vbox width="100%" caption="Fourth" box.expandRatio="1"/>
        </hbox>

С уважением,
Дмитрий

1 симпатия

Огромное спасибо!
Помогло! На всякий случай напишу здесь, если кто-то тоже будет искать, как это сделать программно (у меня котлин):

        parentBox.setExpandRatio(firstChild, 1F)
        parentBox.setExpandRatio(secondChild, 5F)
        parentBox.setExpandRatio(thirdChild, 3F)
        parentBox.setExpandRatio(fourthchild, 1F)

Метод вызываем у родителя, а дитя передаем как первый параметр (это именно для случая, когда боксы внутри бокса)