actionscript-3 - VGroup - 分散レイアウトの適用方法

Question

VGroup に 3 つの BorderContainer を配置します。
コンテナごとにサイズが異なります。
VGroup 内で配布する方法を説明してもらえますか?

ありがとう

Answer 1

3 つの BorderContainers が VGroup の同じ量を占めるようにする場合は、次のようなことを試してください。

<s:VGroup width="100%" height="100%">
    <s:BorderContainer width="100%" height="33%">
        ...
    </s:BorderContainer>
    <s:BorderContainer width="100%" height="33%">
        ...
    </s:BorderContainer>
    <s:BorderContainer width="100%" height="33%">
        ...
    </s:BorderContainer>
</s:VGroup>

または、Actionscript で宣言している場合。

var b:BorderContainer = new BorderContainer();
...
b.percentWidth = 100;
b.percentHeight = 33;

等

Answer 2

以下のコードは、実装するためのいくつかのアイデアを提供する場合があります:-コンテナの動的な高さを取得できるため、要件に従ってロジックを変更できます.....

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" >
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[

            private var heightArray:Array = new Array(200,800,400);
//dynamic array created at run time
            private function calculateHeight():void
            {
                var totalHeight:Number = heightArray[0]+heightArray[1]+heightArray[2];
                //for more values in array use for loop as per user specification
                container1.percentHeight = (heightArray[0]/totalHeight) * 100;
                container2.percentHeight = (heightArray[1]/totalHeight) * 100;
                container3.percentHeight = (heightArray[2]/totalHeight) * 100;
            }

        ]]>
    </fx:Script>
    <s:VGroup width="100%" height="100%" creationComplete="calculateHeight()">
        <s:BorderContainer id="container1" width="100%" >
        </s:BorderContainer>
        <s:BorderContainer  id="container2" width="100%" >
        </s:BorderContainer>
        <s:BorderContainer  id="container3" width="100%" >
        </s:BorderContainer>
    </s:VGroup>

</s:Application>