使UICollectionViewFlowLayout不在同一行上使单元居中

Question

根据苹果文件：

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的基本行为。

我建议您看一下Ray Wenderlich的本教程 ， 该教程从地面构建瀑布布局，或者-如果您需要一个已经打包的库-使用GitHub上的库，例如CHTCollectionViewWaterfallLayout ， WaterfallCollectionView或CollectionViewWaterfallLayout

Answer 2

您想要实现的目标称为“交错布局”。 它是由Pinterest在其iOS应用中引入的。

您将需要自定义集合视图布局， 本教程将说明如何进行。 或者，您可以使用现有解决方案之一，例如CHTCollectionViewWaterfallLayout 。