如何使宽度单元格等于字符串长度？

Question

我有一个用UICollectionView制作的标签。如何使每个单元格宽度等于字符串长度？

在收藏夹视图中我有

1）HEADER（collectionHeader =标签的collectionView）

2）CONTENT（内容的集合视图）

HEADER =集合视图有类TagCell

在页脚中列出此类。

-----列表收集视图类TagCell -----

 class TagCell: UICollectionViewCell, UICollectionViewDelegateFlowLayout, UICollectionViewDelegate, UICollectionViewDataSource {

var resultController:ResultController?

var tagsName = [String]()
var tagsIndex = [String]()



lazy var mainCollectionView : UICollectionView = {
    let layout = UICollectionViewFlowLayout()
    let mc = UICollectionView(frame: .zero, collectionViewLayout: layout)
    mc.translatesAutoresizingMaskIntoConstraints = false
    mc.delegate = self
    mc.dataSource = self
    return mc
}()


override init(frame : CGRect) {
    super.init(frame: frame)
    setupView()
    mainCollectionView.register(Tags.self, forCellWithReuseIdentifier: "cell")
}

func setupView(){
    addSubview(mainCollectionView)
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0":mainCollectionView]))
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0":mainCollectionView]))
}

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

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! Tags
    cell.backgroundColor = UIColor.red
    cell.headerLabel.text = tagsName[indexPath.item]
    cell.layer.cornerRadius = 5
    return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
    return UIEdgeInsets(top: 10, left: 5, bottom: 10, right: 5)
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: 70, height: 30)

    required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}
  }

e.g。在尝试了@NickCatib后，我得到了以下结果

---- LISTING TAG CLASS（单元格类）

     class Tags : UICollectionViewCell {

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

var headerLabel:UILabel = {
    let label = UILabel()
    label.text = ""
    label.font = UIFont.systemFont(ofSize: 12)
    label.translatesAutoresizingMaskIntoConstraints = false
    return label
}()

func setupView(){
    addSubview(headerLabel)
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-2-[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0":headerLabel]))
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0":headerLabel]))
}


required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

}

Answer 1

对于这个问题，我创建了扩展名：

extension String
{   
    func widthWithConstrainedHeight(_ height: CGFloat, font: UIFont) -> CGFloat {
        let constraintRect = CGSize(width: CGFloat.greatestFiniteMagnitude, height: height)

        let boundingBox = self.boundingRect(with: constraintRect, options: .usesLineFragmentOrigin, attributes: [NSFontAttributeName: font], context: nil)

        return boundingBox.width
    }
}

您可以像这样使用它：

let font = UIFont.systemFont(ofSize: 12)
let size = string.widthWithConstrainedHeight(17, font: font)
return NSSize(width: size + 10, height: 17)

在您的特定情况下：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let string = tagsName[indexPath.item]
    let font = UIFont.systemFont(ofSize: 12)
    let size = string.widthWithConstrainedHeight(30, font: font)
    return NSSize(width: size + 10, height: 30)
}

注意：请务必使用您的字体和大小。在您的单元格上设置约束以进行前导和尾随。

另外，我在左侧和右侧的空格中添加了10，所以它确实有一些边距。