使UICollectionViewFlowLayout不使单元格居中于同一行

Question

根据Apple文件：

If you want to specify different sizes for your cells, you must implement the collectionView:layout:sizeForItemAtIndexPath: method on the collection view delegate. You can use the provided index path information to return the size of the corresponding item. During layout, the flow layout object centers items vertically on the same line, as shown in Figure 3-2. The overall height or width of the line is then determined by the largest item in that dimension.

https://developer.apple.com/library/content/documentation/WindowsViews/Conceptual/CollectionViewPGforIOS/UsingtheFlowLayout/UsingtheFlowLayout.html#//apple_ref/doc/uid/TP40012334-CH3-SW1

现在我有一个包含2列和高度不同的单元格的集合视图。问题是较小的细胞在其左侧/右侧较高的细胞居中，但不会漂浮，其下面的细胞也浮起。

我怎样才能实现这一目标？

我有什么：

我想要的是什么：

似乎我应该将UICollectionViewFlowLayout子类化，但是我该如何实现呢？

Answer 1

您想要的集合视图布局类型称为“瀑布布局”。实现有点棘手，因为您需要覆盖UICollectionViewFlowLayout的基本行为。

我建议您查看this tutorial by Ray Wenderlich从地面构建瀑布布局，或者 - 如果您需要已打包的库 - 使用GitHub上的库，例如CHTCollectionViewWaterfallLayout，{{ 3}}或WaterfallCollectionView

Answer 2

您想要达到的目标是＆＃34;交错布局＆＃34;。它是由Pinterest在他们的iOS应用程序中引入的。

您需要自定义集合视图布局，this tutorial将解释如何。或者，您可以使用现有解决方案之一，例如CHTCollectionViewWaterfallLayout。