Swift UICollection 单元格设置每隔一行的高度

Question

我正在尝试创建一个包含两列的表格，其中偶数行比奇数行高。这就是我目前拥有的。

import UIKit

class FBSCollectionViewCell: UICollectionViewCell {


    @IBOutlet weak var cellText: UILabel!

}

class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate  {

    let identifier = "customCell"
    @IBOutlet weak var collectionView: UICollectionView!


    override func viewDidLoad() {
        super.viewDidLoad()
        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 20, left: 0, bottom: 10, right: 0)
        layout.itemSize = CGSize(width: 333, height: 50)
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0
        collectionView!.collectionViewLayout = layout
    }

    let reuseIdentifier = "cell" // also enter this string as the cell identifier in the storyboard
    var items = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"]


    // MARK: - UICollectionViewDataSource protocol

    // tell the collection view how many cells to make
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return self.items.count
    }

    // make a cell for each cell index path
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        // get a reference to our storyboard cell
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: identifier, for: indexPath as IndexPath) as! FBSCollectionViewCell

        cell.cellText.text = self.items[indexPath.item]

        if (indexPath.item % 4 < 2){ //title cells
            cell.backgroundColor = UIColor(red: 95/255, green: 176/255, blue: 223/255, alpha: 1)
            cell.cellText.textColor = UIColor.white
            cell.frame.size.height = 50.0
            //cell.frame.size.width = 333.0
        }else{
            cell.backgroundColor = UIColor(red: 236/255, green: 236/255, blue: 236/255, alpha: 1)
            cell.cellText.textColor = UIColor(red: 178/255, green: 178/255, blue: 178/255, alpha: 1)

            print("in the even rows \(indexPath.row)")
            cell.frame.size.height = 200.0
            //cell.frame.size.width = 333.0
        }
        return cell
    }


}

出于某种原因，格式似乎只适用于最后一行。

我认为这可能是由于这条线覆盖了大小。

layout.itemSize = CGSize(width: 333, height: 50)

所以我评论了该行并添加了

cell.frame.size.width = 333.0

这使得细胞相互碰撞。

我尝试过其他改变大小的方法，例如

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if (indexPath.row % 4 < 2) {
        return CGSize(width: 333, height: 50.0)
    } else {
        return CGSize(width: 333, height: 100.0)
    }

}

和layoutIfNeeded，但没有任何效果。谁能指出我做错了什么？谢谢。

Answer 1

实现UICollectionViewDelegateFlowLayout的sizeForItemAt方法

extension ViewController: UICollectionViewDelegateFlowLayout {

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


        if (indexPath.item % 4 < 2){ //title cells
            return CGSize(width: self.view.frame.width/2, height: 100)
        }else{
            return CGSize(width: self.view.frame.width/2, height: 200)

            print("in the even rows \(indexPath.row)")
        }
    }

}