使用UICollectionView创建网格布局

Question

我想要构建一个类似于网格的集合视图布局。其中包含：

1. 包含子行的行
2. 包含子列的列
3. 高度不固定的行
4. 可以在两个方向上滚动
5. 可以添加/删除行/列

我尝试使用集合流布局，但它变得非常复杂。对我来说，构建自定义布局似乎是更好的选择。

我遇到了一些问题：

1. 数据结构（基本类层次结构）以存储仅支持轻松添加/删除行和列的网格信息（仅布局）。
2. 计算内容视图的高度，因为行的大小可能不同。
3. 计算将位于可见矩形内的行范围。现在，我需要收集所有行的高度信息并将其存储在数组中，然后进一步计算内容大小的高度。另外，为了决定哪些行位于给定的矩形内，我必须应用谓词。每次调用“layoutAttributesForElementsInRect”时在500+行时降低fps仍然可以接受。
4. 我尝试维护可见行和列的布局属性的NSSet，并随着行/列的移动清除/添加属性。但是，这比为可见项目创建每个属性更慢。此外，什么设计模式最适合网格？
5. 最后但并非最不重要的，是否可以使用UICollectionView设计出这样的布局？

有任何处理这个问题的想法吗？

谢谢:)

- Rakesh.P

Answer 1

我遇到了和你一样的问题，我用这种方法解决了它（Swift 示例）。

在此示例中，单元格是正方形绘制的，2 列 x N 行。

class CustomViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout

    @IBOutlet var collectionView: UICollectionView! 

    override func viewDidLoad() {
      super.viewDidLoad()
      collectionView.delegate = self;
      collectionView.dataSource = self;
    }

    //MARK: - Collection view flow layout delegate methods -

    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
      let screenSize = UIScreen.mainScreen().bounds
      let screenWidth = screenSize.width
      let cellSquareSize: CGFloat = screenWidth / 2.0
      return CGSizeMake(cellSquareSize, cellSquareSize);
    }

    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets {
       return UIEdgeInsetsMake(0, 0, 0.0, 0.0)
    } 

    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat {
       return 0.0
    }

    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat {
       return 0.0
    }

}

- Luca Davanzo