时间戳

首页 > 解决方案 > 以编程方式在 UITableView 单元格中显示 UIStackView

uitableview - 以编程方式在 UITableView 单元格中显示 UIStackView

问题描述

我想在其中显示带有 3 个标签的水平 UIStackView，但我看不到标签...

override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
    super.init(style: style, reuseIdentifier: reuseIdentifier)
    let stackView = UIStackView(arrangedSubviews: [label1,label2,label3])
    stackView.distribution = .fill
    stackView.axis = .horizontal
    stackView.spacing = 8
    stackView.alignment = .center
    backgroundColor = .black
    addSubview(stackView)


    stackView.leftAnchor.constraint(equalTo: leftAnchor, constant: 8).isActive = true
    stackView.rightAnchor.constraint(equalTo: rightAnchor, constant: 8).isActive = true
    stackView.topAnchor.constraint(equalTo: topAnchor, constant: 8).isActive = true
    stackView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: 8).isActive = true
}

我尝试过使用锚点，但也没有成功。怎么做？

标签： uitableviewlabeluistackview

解决方案

情侣笔记...

  1. 您应该将子视图添加到单元格contentView，而不是单元格本身。

  2. 从您显示的代码中，您没有设置stackView.translatesAutoresizingMaskIntoConstraints = false

  3. 您应该使用leadingAnchorandtrailingAnchor而不是 left/right

这是一个入门单元，可以帮助您上路：

class BogdanCell: UITableViewCell {

    let label1: UILabel = {
        let v = UILabel()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .yellow
        v.text = "Label 1"
        v.textAlignment = .center
        return v
    }()

    let label2: UILabel = {
        let v = UILabel()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .yellow
        v.text = "Label 2"
        v.textAlignment = .center
        return v
    }()

    let label3: UILabel = {
        let v = UILabel()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .yellow
        v.text = "Label 3"
        v.textAlignment = .center
        return v
    }()

    let theStackView: UIStackView = {
        let v = UIStackView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.axis = .horizontal
        v.alignment = .center
        v.distribution = .fill
        v.spacing = 8
        return v
    }()

    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        commonInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    func commonInit() -> Void {

        backgroundColor = .black

        theStackView.addArrangedSubview(label1)
        theStackView.addArrangedSubview(label2)
        theStackView.addArrangedSubview(label3)

        contentView.addSubview(theStackView)

        NSLayoutConstraint.activate([
            theStackView.topAnchor.constraint(equalTo: contentView.layoutMarginsGuide.topAnchor, constant: 0.0),
            theStackView.bottomAnchor.constraint(equalTo: contentView.layoutMarginsGuide.bottomAnchor, constant: 0.0),
            theStackView.leadingAnchor.constraint(equalTo: contentView.layoutMarginsGuide.leadingAnchor, constant: 0.0),
            theStackView.trailingAnchor.constraint(equalTo: contentView.layoutMarginsGuide.trailingAnchor, constant: 0.0),
            ])

    }

}

推荐阅读