如何使用 UICollectionView 和从 Internet 获取的数据模型呈现瀑布外观

Question

我正在从互联网上获取包含文本字符串、图片等内容的数据 url，并且我已将它们转换为我的数据模型。

现在我想用 UICollectionView 在两个相等的列和不同高度的行中显示数据。

由于下载的图片可能有不同的尺寸，每个 UICollectionViewCell 应该有不同的尺寸。但我将它们设为固定宽度，以便高度可以动态适应宽度。

我所做的是创建了一个自定义 UICollectionView、一个自定义 UICollectionViewCell 和一个默认 UICollectionViewFlowLayout，我将指向数据模型数组的指针传递给我的自定义 UICollectionViewCell，并将数据模型中的值分配给 layoutSubViews.

中单元格中的子视图

问题是我无法计算每个单元格的 height，因为我的数据模型只有 url，图像的 size 只有在它们被计算后才能知道下载。

现在我所做的只是等到图像下载完毕，然后我获取图像的高度并将其添加到我的数据模型中。但这应该是错误的，因为当我 运行 它的细胞被弄得像这样：

所以我的问题是一旦获得图像的高度或者是否有更好的解决方案来重新布局每个单元格（什么时候是最好的时间）。

谢谢。

Answer 1

我做了一些研究，我发现自定义您自己的 UICollectionViewFlowLayout 以显示具有跨越行边界的动态高度的单元格可能很复杂。

我找到了一个名为 CHTCollectionViewWaterfallLayout 的好库，它帮助了我。

Here 是作者 github 的 link 如果有人感兴趣的话。