Проблема с прокруткой списка искр с помощью TileLayout в Flex 4.5 - PullRequest
0 голосов
/ 01 сентября 2011

Я испытываю очень странное поведение со списком искр, когда TileLayout находится внутри скроллера.По сути, я хочу иметь область заголовка над моим списком, которая прокручивается, когда пользователь прокручивает список вниз.Для этого я поместил заголовок и список в группу и обернул группу внутри скроллера с шириной и высотой = 100%.Я также отключил вертикальный ScrollPolicy в списке, чтобы убедиться, что все прокручивается вместе.

Проблема в том, что если в списке по умолчанию есть VerticalLayout, то все работает нормально, но если вы назначаете TileLayout для того же списка, он только частичноотображает элементы (около 30 элементов при тестировании на iPhone 4).

Вот полностью функционирующий код.Сначала попробуйте так, затем попробуйте удалить деталь <s:layout>, чтобы убедиться, что она хорошо работает с VerticalLayout:

<?xml version="1.0" encoding="utf-8"?>
<s:View 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"
    >

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            [Bindable]
            public var myAC:ArrayCollection = new ArrayCollection([
                "01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31","32","33","34","35","36","37","38","39","40","41","42","43","44","45","46","47","48","49","50","51","52","53","54","55","56","57","58","59","60","61","62","63","64","65","66","67","68","69","70","71","72","73","74","75","76","77","78","79","80","81","82","83","84","85","86","87","88","89","90","91","92","93","94","95","96","97","98","99","100"
            ]);
        ]]>    
    </fx:Script>

    <s:Scroller width="100%" height="100%">
        <s:VGroup>

            <s:Label text="TITLE" width="100%" height="200" backgroundColor="#333333" color="#EEEEEE"/>

            <s:List
                id="list"
                width="100%"
                verticalScrollPolicy="off"
                dataProvider="{myAC}" >

                <s:layout>
                    <s:TileLayout 
                        columnWidth="200"
                        rowHeight="200"
                        useVirtualLayout="true" />
                </s:layout>

            </s:List>

        </s:VGroup>
    </s:Scroller>     

</s:View>

Что я делаю не так?Или это ошибка?

1 Ответ

4 голосов
/ 02 сентября 2011

Вам необходимо рассчитать и установить высоту списка. Вы можете легко вычислить это, вычислив число строк, умноженное на высоту строки, как показано ниже:

private function listHeight():Number {
    // In this example you had 3 items to a row on the iPhone4 emulator
    var numRows:Number = Math.ceil(myAC.length / 3);

    // The height of the row (200) plus the gap between rows (6)
    var rowHeight:Number = 200 + 6;
    return numRows * rowHeight;
}

Это не идеальное решение, особенно если вы ориентируетесь на несколько плотностей экрана (так как количество элементов в строке будет отличаться от устройства к устройству), но оно может привести вас на правильный путь.

Лучшим решением было бы расширить компонент списка в классе ActionScript и добавить заголовок, который можно установить.

...