Question

我有一个列表组件，在一个位于主Application中的组中具有（面向行）的tile布局。

我希望列表在没有足够的项目填充应用程序窗口高度时垂直居中，因此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％的组中。高度，但我或多或少有相同的行为，除了列表是高于容器的顶部齐平。

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>

将Spark Element的maxHeight设置为Container的100％

2 个答案: