actionscript-3 - VGroup - 如何应用分布式布局

Question

我将 3 个 BorderContainer 放在一个 VGroup 上。
每个容器都有不同的大小。
你能解释一下如何在 VGroup 内部分配吗？

谢谢

Answer 1

下面的代码可能会给出一些实现的想法：-您可以根据需要修改逻辑，因为您可以获得容器的动态高度.....

<?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>

Answer 2

如果您希望您的三个 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;

等等