UICollectionView中仅某些单元格之间的自定义间距

Question

我试图创建一个UICollectionView ，它是水平滚动和单行。 可以将单元格动态添加到集合的末尾。 我想要的行为是，当UICollectionView有一定数量的单元格并添加了一个新单元格时，前x个单元格将压缩它们的间距，同时保持相同的大小。 理想情况下，我希望第一个x单元实际上彼此重叠（看起来像一个堆栈），以节省最大空间。 x之后集合中的其余单元格将以它们之间的正常间距显示。

视觉效果：

( ) ( ) ( ) ( ) ( )正常布局，其中( )是一项

当再添加两个项目时，将变为：

((((( ) ( ) ( )

或( ))))) ( ) ( )如果第一个项目位于堆栈顶部（我现在不介意哪一个，仅堆栈很重要）

谁能提供有关如何实现此目标的帮助和建议？

Answer 1

对于感兴趣的任何人，我都可以通过将UICollectionViewFlowLayout子类化UICollectionViewFlowLayout如下所示进行覆盖来实现。 addCell ，我在集合的末尾使用了一个额外的单元格作为addCell按钮，因此该实现考虑了这一点，并且在添加了5个真实项目并且您要添加第6个addCell之后将进行重新排列。 通常放置时，我的单元格的宽度为50 ，最小间距为10 。

override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
    guard collectionView!.numberOfItems(inSection: 0) > 6 else {
        return super.layoutAttributesForElements(in: rect)
    }

    let layouts = super.layoutAttributesForElements(in: rect)?.map { $0.copy() as! UICollectionViewLayoutAttributes }
    for (index, layout) in layouts!.enumerated() {
        var frame = layout.frame
        frame.origin.x = frame.origin.x - (35.0 * CGFloat(index < 5 ? index : (index - (index - 4))))
        layout.frame = frame
    }

    return layouts
}

Answer 2

您可以实现自己喜欢的任何定位，因为您可以编写UICollectionViewLayout来告诉集合视图如何定位其项目。

默认情况下，流布局将不执行您所描述的内容。 它只是基于集合视图内容的宽度和您提供的最小项目间距，以每行相同的间距布置所有项目。 但是，如果您继承UICollectionViewFlowLayout的子类 ，则可能可以修改流布局的行为以执行您要描述的事情。 因此，您无需完全从头开始编写布局对象。

但是，为了获得最大的灵活性，完全可以从头开始编写布局对象。 真的并不难。 苹果有很多例子，当然还有很多教程例子。