Проблема с компоновкой Adobe Flex. вложенные контейнеры внутри VGroup, 100% высота не работает

Question

У меня есть вложенный макет, который является динамическим (размеры представляют собой процентные значения) или, по крайней мере, это должно быть.

Я удалил текст строки из кода:

<s:VGroup width="98%" height="70%" 
    horizontalAlign="center" 
    horizontalCenter="0"> 
<s:BorderContainer 
    borderStyle="inset" borderWeight="1" 
    cornerRadius="20" 
    textAlign="center" 
    width="100%" height="100%"> 
    <s:layout> 
    <s:HorizontalLayout gap="0" 
     verticalAlign="middle"/> 
    </s:layout> 
    <s:Label width="60%" height="100%" 
    verticalAlign="middle" 
    textAlign="right"/> 
    <s:HGroup horizontalAlign="center" 
     width="40%" height="100%" 
     gap="0"> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" 
     textAlign="center"/> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" /> 
    </s:HGroup> 
</s:BorderContainer> 
<s:BorderContainer 
    borderStyle="inset" borderWeight="1" 
    cornerRadius="20" 
    textAlign="center" 
    width="100%" height="100%"> 
    <s:layout> 
    <s:HorizontalLayout gap="0" 
     verticalAlign="middle"/> 
    </s:layout> 
    <s:Label width="60%" height="100%" 
    verticalAlign="middle" 
    textAlign="right"/> 
    <s:HGroup horizontalAlign="center" 
     width="40%" height="100%" 
     gap="0"> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" 
     textAlign="center"/> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" /> 
    </s:HGroup> 
</s:BorderContainer> 
<s:BorderContainer 
    borderStyle="inset" borderWeight="1" 
    cornerRadius="20" 
    textAlign="center" 
    width="100%" height="100%"> 
    <s:layout> 
    <s:HorizontalLayout gap="0" 
     verticalAlign="middle"/> 
    </s:layout> 
    <s:Label width="60%" height="100%" 
    verticalAlign="middle" 
    textAlign="right"/> 
    <s:HGroup horizontalAlign="center" 
     width="40%" height="100%" 
     gap="0"> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" 
     textAlign="center"/> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" /> 
    </s:HGroup> 
</s:BorderContainer> 
<s:BorderContainer 
    borderStyle="inset" borderWeight="1" 
    cornerRadius="20" 
    textAlign="center" 
    width="100%" height="100%"> 
    <s:layout> 
    <s:HorizontalLayout gap="0" /> 
    </s:layout> 
    <s:Label width="60%" height="100%" 
    verticalAlign="middle" 
    textAlign="right"/> 
    <s:HGroup horizontalAlign="center" verticalAlign="middle" 
     width="40%" height="100%" 
     gap="0"> 
    <s:Group width="100%" height="100%"> 
    <s:Rect width="80%" height="80%" 
     horizontalCenter="0" verticalCenter="0" 
     bottomLeftRadiusX="15" topRightRadiusX="15"> 
    <s:fill> 
     <s:SolidColor color="0xFFFFFF" /> 
    </s:fill> 
    </s:Rect> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" 
     textAlign="center"/> 
    </s:Group> 
    <s:Label height="100%" width="100%" 
     verticalAlign="middle" /> 
    </s:HGroup> 
</s:BorderContainer> 
</s:VGroup> 

Как вы видите на картинке четыре «строки» слишком высоки, чтобы вписаться в компонент (который является столь же большим, как черный фон).

Я не знаю, как исправить эту проблему, есть ли у вас какие-либо намеки?

Это схематичный пример того, как это выглядит: alt text http://www.freeimagehosting.net/uploads/a8159c57d2.png

Answer 1

Я предполагаю, что вы пытаетесь сделать пограничные контейнеры подходят в пределах ограничений VGroup. Один трюк, чтобы сделать эту работу, - установить minHeight = "0" на каждом из четырех BorderContainers, чтобы заставить повторить измерение. Если я не согласен с этим, предоставьте дополнительную информацию о том, какой результат вы ищете конкретно. Надеюсь, это поможет.