Swift - 如何用单元格填充collectionview答案

【问题标题】：Swift - How to fill collectionview with cellsSwift - 如何用单元格填充collectionview
【发布时间】：2018-07-08 13:30:00
【问题描述】：

我想用单元格填充我的收藏视图。所以我给它们设置了不同的尺寸，但它们应该彼此相邻。我目前的情况如下：

我想让单元格彼此相邻。如下：

我的 Collectionview-Class 如下所示：

class OverviewViewController: UICollectionViewController, UICollectionViewDelegateFlowLayout {

override func viewDidLoad() {
    super.viewDidLoad()
    setupCollection()
    setupView()
}

private func setupCollection() {
    self.collectionView!.register(GoalCell.self, forCellWithReuseIdentifier: goalCellIdentifier)
    self.collectionView?.dataSource = self
    self.collectionView?.delegate = self
    self.collectionView?.backgroundColor = .white
}

private func setupView() {
    self.navigationItem.title = "Goals"
    if #available(iOS 11.0, *) {
        self.navigationController?.navigationBar.prefersLargeTitles = true
    }
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
}

override func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 1
}


override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return DataProvider.sharedInstance.getGoals().count
}

override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: goalCellIdentifier, for: indexPath) as! GoalCell
    cell.goalEntry = DataProvider.sharedInstance.getGoals()[indexPath.row]
    cell.setup()
    return cell
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let cellHeight = UIScreen.main.bounds.height / 4.0 - 20
    let cellWidth = UIScreen.main.bounds.width / 3.0 - 1.0
    let cell = DataProvider.sharedInstance.getGoals()[indexPath.row]
    switch cell.type! {
    case GoalType.daily:
        return CGSize(width: cellWidth, height: cellHeight)
    case GoalType.yearly:
        return CGSize(width: cellWidth * 2, height: cellHeight * 2)
    case GoalType.lifely:
        return CGSize(width: cellWidth * 3, height: cellHeight * 3)
    }
}

我使用以下代码初始化了我的 collectionview：

let overviewFlowLayout = UICollectionViewFlowLayout()
    overviewFlowLayout.minimumLineSpacing = 0.0
    overviewFlowLayout.minimumInteritemSpacing = 0.0
    let overviewVC = OverviewNavViewController(rootViewController: OverviewViewController(collectionViewLayout: overviewFlowLayout))

我真的不知道该怎么办了...希望有人能帮帮我！谢谢！

【问题讨论】：

如果没有子类化和使用您自己的UICollectionViewFLowLayout，则无法完成大图右侧的两个图像。默认一个会将它们中的每一个并排放置（如果它们适合（以水平方式）），如果不合适，它将把它放在“下一行”中，不会再做任何事情。我在那里提供了样品：stackoverflow.com/questions/43186246/…

标签： ios swift uicollectionview

【解决方案1】：

您正在使用 UICollectionViewFlowLayout，它无法按照您的想法工作。要获得第二个屏幕截图中显示的那种布局，您必须编写自己的布局类。

【讨论】：

【解决方案2】：

您必须实现自己的custom collectionViewLayout，或者您可能会尝试找到现成的开源解决方案，也许CHTCollectionViewWaterfallLayout 可能与您正在寻找的足够接近。

【讨论】：

【解决方案3】：

最终你需要使用flowlayout，你不能在storyboard中对collectionviewcell使用约束，

此功能将使用边界自定义单元格大小，我用我的连续呈现 2 个单元格

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

    let paddomg:CGFloat = 25
    let collectionviewsize = collectionView.frame.size.width - paddomg


    return CGSize(width: collectionviewsize/2 ,height: 120)
}

如果我是你，我会使用两个自定义单元格，并根据索引在视图布局中分配大小和位置

【讨论】：