TileLayout具有用于分页的动态行和列

我正在实现一个图像库，它将资产呈现为形成网格的大小相同的框。我认为我可以通过使用spark.layouts.TileLayout轻松实现，但不幸的是我有一些额外的要求，我无法用它来实现。TileLayout具有用于分页的动态行和列

总体原则应该是在给定的空间内尽可能多地提供框。该应用程序的整个布局是liquid并取决于用户的屏幕分辨率。

我从一个基本DataGroup开始用TileLayout：

<s:DataGroup id="dgpImages" width="100%" height="100%" top="12" dataProvider="{ list }" 
    minHeight="0" minWidth="0" clipAndEnableScrolling="true" itemRenderer="LibraryImageRenderer"> 
    <s:layout> 
     <s:TileLayout orientation="rows" clipAndEnableScrolling="true" 
      requestedColumnCount="-1" requestedRowCount="-1" 
      verticalGap="12" horizontalGap="12" useVirtualLayout="true" /> 
    </s:layout> 
</s:DataGroup>

我不知道RequestedColumnCount或RequestedRowCount提前，因为它们依赖于可用空间，所以上面的代码从left-to-right，然后从top-to-bottom布局的所有元素 - 这是尽可能接近我真正想要实现的。

问题

的箱这个名单应该是呈现假分页的电缆。实际上，这意味着如果最后一个可见行不完全符合可用空间，则应将其移至下一页。

给你一个例子让我们想象一下，我们有一个10张图片的列表。每个都是10x10像素，但我的屏幕分辨率只允许我适合35x35像素的网格。这意味着一个页仅能够在3×3网格的形式呈现9幅图像（如5像素是不够的，呈现完整图像）。第10张图像应该是转移到第二页。

这显然不是自动与该我上面作为TileLayout允许显示部分可见的行（在垂直方向上滚动的列表的一种形式）粘贴的代码发生的问题。 我想知道如何实现上述行为。

如果上述描述不健全的逻辑，请让我知道，这样我能适应它（或包含更多细节）。

任何帮助将不胜感激！

来源

2011-07-07 MonkeyCoder

这里没有实际的问题......有什么问题？ –

是的，问题部分确实缺失:) - 检查我的更新 – MonkeyCoder

个人而言，我认为你最好为这种功能创建一个自定义组件。您可以计算大小，并通过知道您要显示的显式高度/宽度，可以知道需要多少行/列。之后，这只是一个改变数据的问题，取决于你想选择哪个'页面'（因为你不会使用滚动条）。 –

您需要创建这种功能的自定义布局。好消息是，我发现了一个教程做几乎你想要在这里雅做确切的事情：

http://www.adobe.com/devnet/flex/articles/spark_layouts.html

所以实施，第一。在updateDisplayList（）方法，寻找这一行：

if (x + elementWidth > containerWidth)

它撞击到下一行检查时

，你会检查总高度与当前行高度并停止若超过boundries添加元素。（只是break out of for循环）

然后，您所要做的就是根据当前页面为该组页面dataProvider。

来源

2011-07-08 04:32:39 Nate

感谢您对自定义布局的不错建议，我已经使用这篇文章通过虚拟化实现了它：http://flexponential.com/2010/03/06/learn-how-to-create-a-simple-virtual- layout-in-flex-4/- 大大提高了性能。干杯! – MonkeyCoder

TileLayout具有用于分页的动态行和列

回答

相关问题