UICollectionView 默认为一列，我如何获得两列？

Question

我最近一直在学习 UICollectionViews，我目前正在尝试实现一个。我需要显示两列，但无论我做什么，它都默认为一列。这里有很多类似的问题，建议使用collectionView 函数sizeForItemAt 调整 UICollectionView 单元格的宽度，但我似乎无法让它工作。

这是我的视图控制器代码：

class PreferencesViewController: UIViewController {

lazy var collectionView : UICollectionView = {
    let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = UICollectionView.ScrollDirection.vertical
    let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
    cv.translatesAutoresizingMaskIntoConstraints = false
    cv.register(CategorySelectorCell.self, forCellWithReuseIdentifier: "categorySelector")
    cv.backgroundColor = .clear
    return cv
}()

override func viewDidLoad(){
    super.viewDidLoad()
    view.backgroundColor = .white

    view.addSubview(collectionView)
    collectionView.backgroundColor = .blue
    collectionView.contentInsetAdjustmentBehavior = .always
    collectionView.delegate = self
    collectionView.dataSource = self
    collectionView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20).isActive = true
    collectionView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20).isActive = true
    collectionView.topAnchor.constraint(equalTo: view.topAnchor, constant: 40).isActive = true
    collectionView.heightAnchor.constraint(equalToConstant: view.frame.height/1.5).isActive = true


    self.view = view
}

}

我的代理扩展：

extension PreferencesViewController: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout{
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    1
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "categorySelector", for: indexPath) as! CategorySelectorCell
    cell.cat = categories[indexPath.section]
    cell.backgroundColor = .red

    return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: collectionView.frame.width/2.5, height: collectionView.frame.width/2)
}
func numberOfSections(in collectionView: UICollectionView) -> Int {
    10
}

}

任何指针表示赞赏！

Answer 1

同时添加这些UICollectionViewDelegateFlowLayout 方法

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }

更新

也将插图设置为零

lazy var collectionView : UICollectionView = {
       let layout = UICollectionViewFlowLayout()
       layout.sectionInset = .zero
       layout.scrollDirection = UICollectionView.ScrollDirection.vertical
       let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
       cv.translatesAutoresizingMaskIntoConstraints = false
       cv.register(CategorySelectorCell.self, forCellWithReuseIdentifier: "categorySelector")
       cv.backgroundColor = .clear
       return cv
   }()

Answer 2

假设您的集合视图 UICollectionViewFlowLayout 有 16 个边缘插入开始和结束。和 minimumInteritemSpacingForSectionAt,minimumLineSpacingForSectionAt 到 16

然后你可以像这样计算你的单元格宽度

(view.frame.width-flowlayoutInsets-sectionSpacing)/2

这是代码

你的收藏视图

let coll: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 0, left: 16, bottom: 0, right: 16)
        let coll = UICollectionView(frame: .zero, collectionViewLayout: layout)
        coll.backgroundColor = .systemPink
        //other stuff
        return coll
    }()

节和行间距

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 16
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
    return 16
}

集合视图单元格大小

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: (view.frame.width-16-16-16)/2, height: 100)
        //1st 16 - left gap - flowlayout left inset
        //2nd 16 - middle gap - section spacing
        // 3rd 16 = right gap - flowlayout right inset
    }