Установите максимальную высоту Spark Element на 100% от контейнера - PullRequest
Новая
       0

Установите максимальную высоту Spark Element на 100% от контейнера

0 голосов
/ 22 августа 2011

У меня есть компонент списка с макетом листов (ориентированным на строки) в группе, которая находится в главном приложении.

Я хочу, чтобы список располагался по центру по вертикали, когда не хватает элементов для заполнениявысота окна приложения, поэтому 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% шириной и высотой, но я получаю более или менее такое же поведение, за исключением того, что список находится наверху, когда он выше контейнера.

Ответы [ 2 ]

2 голосов
/ 23 августа 2011

Вы можете попробовать что-то вроде этого: 

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

Вы также можете изменить значение maxHeight всякий раз, когда его родительский контейнер меняет размеры.

Чтобы получить полный ответ, я думаю, вам нужно будет показать некоторый код о том, как все устроено.

1 голос
/ 09 октября 2014

Вот как автоматически установить значение 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>
...