Apache flex 在Flex 4.5中使用TileLayout滚动火花列表时出现问题

我经历了一个非常奇怪的行为，在滚动条中放置了一个带有TileLayout的火花列表。基本上，我希望在我的列表上方有一个标题区域，当用户向下滚动列表时，该区域会滚动掉。为此，我将标题和列表放在一个组中，并将组包装在一个宽度和高度均为100%的滚动条中。我还将列表上的verticalScrollPolicy设置为off，以确保所有内容一起滚动

问题在于，如果列表具有默认的VerticalLayout，则一切正常，但如果将TileLayout分配给同一列表，则只会部分呈现项目（在iPhone4上测试时约30个项目）

这是完整的代码。首先尝试这样做，然后尝试删除

部分，以确认它与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>

---

我做错了什么？或者这是一个bug？

您需要计算并设置列表的高度。您可以通过计算行数乘以行高来轻松计算，如下所示：

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类中扩展列表组件，并添加一个可以设置的标题。

您需要计算并设置列表的高度。您可以通过计算行数乘以行高来轻松计算，如下所示：

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类中的列表组件，并添加一个可以设置的标题。

我不明白您要实现什么。我不明白您要实现什么。谢谢Chad，我喜欢扩展列表类并添加标题的解决方案。非常优雅，比我想做的要高效得多。在花了一整天的时间试图找出如何扩展列表类之后，我在这里发布了一个关于它的问题。也许你可以试着回答？谢谢Chad，我喜欢扩展List类并添加标题的解决方案。非常优雅，比我想做的要高效得多。在花了一整天的时间试图找出如何扩展列表类之后，我在这里发布了一个关于它的问题。也许你可以试着回答？