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具有用於分頁的動態行和列

回答

相關問題