将 Spark 元素的 maxHeight 设置为容器的 100%

Question

我有一个列表组件，其位于主应用程序的组中，具有（面向行的）平铺布局。

当没有足够的项目来填充应用程序窗口高度时，我希望列表垂直居中，因此verticalCenter =“0”。

但是，当屏幕上垂直容纳的项目数量过多时，列表会扩展到应用程序窗口高度之外，并且滚动条不会启动。

如果将列表高度设置为 100%，我可以解决此问题，但这意味着它不是垂直的当包含较少项目时居中。

理想的解决方案是 maxHeight="100%"，但当然 maxHeight 不适用于百分比。我将如何实现这种行为？

谢谢，

蒂姆

编辑：请参阅下面的代码：

<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                       xmlns:s="library://ns.adobe.com/flex/spark" 
                       xmlns:mx="library://ns.adobe.com/flex/mx"
                       applicationComplete="applicationCompleteHandler(event)"
                       width="800" height="600"
                       showStatusBar="false">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;
            import mx.events.FlexEvent;

            protected function applicationCompleteHandler(event:FlexEvent):void
            {
                var arrayList:ArrayList = new ArrayList;
                for (var i:int = 1; i <= 50; i ++)
                {
                    arrayList.addItem(String(i));
                }
                list.dataProvider = arrayList;
            }

        ]]>
    </fx:Script>

    <s:List id="list"
            itemRenderer="itemRenderer"
            useVirtualLayout="false"
            horizontalCenter="0" verticalCenter="0"
            borderVisible="false">

            <s:layout>
                <s:TileLayout orientation="rows"
                              requestedColumnCount="4"
                              columnWidth="150" rowHeight="150"/>
            </s:layout>

        </s:List>


</s:WindowedApplication>

这是我的项目渲染器：

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="true">

    <s:Rect width="100%" height="100%">
        <s:stroke>
            <s:SolidColorStroke color="0"/>
        </s:stroke>
    </s:Rect>

    <s:Label text="{data}"
             horizontalCenter="0" verticalCenter="0" fontSize="50"/>

</s:ItemRenderer>

如果将 for 循环更改为仅 10 次迭代，则列表在屏幕上垂直居中。否则，列表将扩展到屏幕之外，垂直居中并且不会出现滚动条。

使用clipAndEnableScrolling 没有任何区别。我还尝试将列表放入一个具有 100% 宽度和 100% 宽度的组中。高度，但我得到了或多或少相同的行为，除了当列表比容器高时列表与顶部齐平。

Answer 1

您可以尝试这样的操作：

<s:List id="list" maxHeight="{list.height}" height="100%" />

您还可以在父容器更改大小时更改 maxHeight 值。

为了获得完整的答案，我认为您必须展示一些有关如何设置的代码。

Answer 2

以下是每当父容器更改大小时自动设置 maxHeight 值的方法（如上面的 JeffryHouser 建议）：

<s:Group id="boostListParent" width="100%" height="80%">
    <s:List id="boostList" width="100%" maxHeight="{boostListParent.height}" height="100%" itemRenderer="views.BoostTierItemRenderer"/>
</s:Group>