0

我有一个包含标签和 imageView 的 collectionView 单元格。imageView 距离单元格顶部 8 点，标签顶部距离 imageView 底部 8 点，标签底部距离单元格底部 8 点。当标签距离单元格的右边缘 -10 点时，标签会换行。

进入标签的文本可以跨越多行。我在 collectionView 中使用以下函数sizeForItem来计算标签的高度：

func estimatedLabelHeight(text: String, width: CGFloat, font: UIFont) -> CGFloat {

    let size = CGSize(width: width, height: 1000)

    let options = NSStringDrawingOptions.usesFontLeading.union([.usesLineFragmentOrigin, .usesFontLeading])

    let attributes = [NSAttributedStringKey.font: font]

    let rectangleHeight = String(text).boundingRect(with: size, options: options, attributes: attributes, context: nil).height

    return rectangleHeight
}

单元格正确扩展，但标签添加了额外的填充，我不知道如何摆脱它。

在此处输入图像描述

这是一个正确换行的多行标签，大小为 22。我在 3D 检查器内拍了一张照片。如您所见，标签文本上方和下方的顶部和底部有相当多的填充。标签在 imageView 下方的 8 点间距是正确的，但额外的填充使它看起来像 24 点间距。

奇怪的是，即使我将标签的大小减小到 16，额外的填充仍然存在。

如何删除此填充？

调用estimateLabelHeight 函数的collectionView 的sizeForItem：

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

    let profileImageViewHeight: CGFloat = 50 // imageView height is set to 50 inside the cell

    let padding: CGFloat = 24 // 8 x 8 x 8 the vertical padding inside the cell between the titleLabel, the imageView, and the cell

    // estimatedLabelHeight is called here
    let titleLabelHeight = estimatedLabelHeight(text: "some very very long text...", width: view.frame.width - 20, font: UIFont.systemFont(ofSize: 22))

    let totalHeightOfCell = titleLabelHeight + profileImageViewHeight + padding

    return CGSize(width: view.frame.width, height: totalHeightOfCell)
}

细胞：

class MyCell: UICollectionViewCell{

    let titleLabel: UILabel = {
        let label = UILabel()
        label.translatesAutoresizingMaskIntoConstraints = false
        label.font = UIFont.systemFont(ofSize: 22)
        label.textColor = UIColor.black
        label.textAlignment = .left
        label.sizeToFit()
        label.numberOfLines = 0
        return label
    }()

    let profileImageView: UIImageView = {
        // created it...
    }

    override init(frame: CGRect) {
        super.init(frame: frame)

        addSubview(profileImageView)
        addSubview(titleLabel)

        profileImageView.topAnchor.constraint(equalTo: self.topAnchor, constant: 8).isActive = true
        profileImageView.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 10).isActive = true
        profileImageView.widthAnchor.constraint(equalToConstant: 50).isActive = true
        profileImageView.heightAnchor.constraint(equalToConstant: 50).isActive = true

        titleLabel.topAnchor.constraint(equalTo: profileImageView.bottomAnchor, constant: 8).isActive = true
        titleLabel.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 10).isActive = true
        titleLabel.rightAnchor.constraint(equalTo: self.rightAnchor, constant: -10).isActive = true
        titleLabel.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: -8).isActive = true

        // I tried to set the label's height using the below but the same padding issue occured
        // let titleLabelHeight = estimatedLabelHeight(text: titleLabel.text!, width: self.frame.width - 20, font: UIFont.systemFont(ofSize: 22))
        // titleLabel.heightAnchor.constraint(greaterThanOrEqualToConstant: titleLabelHeight).isActive = true
    }
}
4

1 回答 1

0

这个问题是由于我自己的粗心造成的。@CSmith 测量 sizeForItem 高度和单元格框架的提示帮助我缩小了范围。

在collectionView单元格内的项目中，我将imageView的底部锚点设置为8而不是-8，并且在collectionView的sizeForItem中，总高度为24。存在冲突，因为因为单元格内有8，所以它应该'在 collectionView 中已经 16 岁了，这种不匹配以某种方式延伸了标签。一旦我更正它并更改了 imageView 的底部锚点 -8 一切都匹配并且标签的填充问题得到解决。

于 2018-09-28T00:38:29.277 回答