Adobe Flex 3: ширина и высота, указанные в процентах, не работают для дочерних элементов стека просмотра

Question

У меня есть ViewStack, что dataProvider для TabBar. Для этого ViewStack есть два VBox ребенка. Он отлично работает с абсолютными значениями ширины и высоты для этих VBox с, но при указании в процентах VBox использует все доступное пространство (100%) для любого процентного значения. Пожалуйста, найдите код и снимки экрана ниже.

Может кто-нибудь объяснить, почему это так? А также как можно выровнять дочерние элементы ViewStack по центру? Для ViewStack нет свойства horizontalAlign, и оно не работает с horizontalCenter= "0".

Код:

<mx:ViewStack id="viewStack" width="100%" height="100%" selectedIndex="0" horizontalCenter="0" textAlign="center">

    <mx:VBox label="Tab 1" width="25%" height="10%" borderThickness="2" borderColor="red"
        borderStyle="solid" horizontalAlign="left">

        <mx:Text text="This is tab 1" />

    </mx:VBox>

    <mx:VBox label="Tab 2" width="30%" height="20%" borderThickness="2" borderColor="haloBlue"
        borderStyle="solid">

        <mx:Text text="This is tab 2" />

    </mx:VBox>

</mx:ViewStack>

Изображение 1 (с абсолютными значениями):

Изображение 2 (с шириной = "25%" и высотой = "10%"):

Спасибо, Анжи

Answer 1

Просто используйте внешний контейнер, который заполняет пространство (это то, что вы хотите в стеке представлений) и поместите свой контент внутрь. Этот внешний контейнер может центрировать ваш внутренний контент. Как это:

<mx:Box label="Tab 1" width="100%" height="100%" horizontalAlign="center">
    <mx:VBox  width="25%" height="10%" borderThickness="2" borderColor="red" 
              borderStyle="solid" >
        <mx:Text text="This is tab 1" />
    </mx:VBox>
</mx:Box>

Answer 2

Пожалуйста, обратитесь по ссылке

View Stack Container , в которой читайте

Определение размера дочерних элементов контейнера ViewStack

тем, что U может получить ясную идею

При необходимости используйте другой контейнер внутри vbox

        ~~~ HappY Coding ~~~