如何匹配水平collectionView单元格的内容大小的宽度

时间:2019-06-16 05:53:28

标签: ios swift uicollectionview uicollectionviewcell uicollectionviewlayout

我已经知道一些与此相关的问题,但是我以前尝试过这些问题,但仍然没有运气。

以下屏幕截图是我的问题 my current collectionView 我当前的屏幕显示一个固定的单元格大小,并且在空白处显示了较大的空间,较大的内容通过点在该单元格上移动。

我想像下面 enter image description here 它应该与产品类别名称内容的宽度匹配。

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    if collectionView == self.catCollectionView{
        let catCell = collectionView.dequeueReusableCell(withReuseIdentifier: "catCell", for: indexPath)
            as! catCell

        DispatchQueue.main.async {
            catCell.configureCell()

            let catCountInt = self.catCountArray[indexPath.row]


            catCell.catCountLabel.text = String(catCountInt)
            catCell.catNameLabel.text = self.categoryNameArray[indexPath.row]
            catCell.catCountLabel.sizeToFit()
            catCell.catNameLabel.sizeToFit()

        }
        return catCell
 func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let catCell = collectionView.dequeueReusableCell(withReuseIdentifier: "catCell", for: indexPath)
        as! catCell
    catCell.catNameLabel.text = self.categoryNameArray[indexPath.item]
    catCell.catNameLabel.sizeToFit()
     let labelWidth = catCell.catNameLabel.frame.width + 10
    print("frame width: \(labelWidth)")
    return CGSize(width: labelWidth, height: 21)
}

}

也许我在这里错过了一件简单的事情,但是我现在还不太清楚。请帮助我,抱歉我的英语很奇怪。

2 个答案:

答案 0 :(得分:2)

让我们假设您正在使用一个简单的UICollectionViewCell子类,该子类在情节提要中正确设置了约束(标签固定在其视图的所有四个侧面),如下所示:

class CategoryCell: UICollectionViewCell {

    @IBOutlet var nameLabel: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()
        layer.borderWidth = 1
    }

}

然后,您只需让自动布局即可确定单元格的大小:

class CollectionViewController: UICollectionViewController {

    let categories = [
        "All Products",
        "Fresh",
        "Health & Beauty",
        "Beverages",
        "Home & life"
    ]

    private var flowLayout: UICollectionViewFlowLayout? {
        return collectionViewLayout as? UICollectionViewFlowLayout
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        collectionView.backgroundColor = .white

        flowLayout?.sectionInset = .init(top: 15, left: 15, bottom: 15, right: 15)
        flowLayout?.sectionInsetReference = .fromSafeArea
        flowLayout?.estimatedItemSize = UICollectionViewFlowLayout.automaticSize

        DispatchQueue.main.async {
            self.flowLayout?.invalidateLayout()
        }
    }

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

    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CategoryCell", for: indexPath) as! CategoryCell
        cell.nameLabel.text = categories[indexPath.row]
        return cell
    }

}

结果:

result

答案 1 :(得分:1)

您可以使用{{1}上的dequeuing来简单计算{{1}的cell,而无需collectionView(_:layout:sizeForItemAt:)中的另外width }},即

categoryName

size(withAttributes:)中,提供您希望categoryName成为的func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { let text = self.categoryNameArray[indexPath.row] { let cellWidth = text.size(withAttributes:[.font: UIFont.systemFont(ofSize:14.0)]).width + 10.0 return CGSize(width: cellWidth, height: 21.0) }