代码之家  ›  专栏  ›  技术社区  ›  David Kroukamp

UIStackView动态添加两个相邻的标签,没有额外的间距

  •  0
  • David Kroukamp  · 技术社区  · 7 年前

    我有两个 UILabel 添加到 UIStackView

    let horizontalStackView1 = UIStackView(arrangedSubviews: [self.label1, self.label2])
    

    当我运行应用程序时,它看起来是这样的:

    enter image description here

    enter image description here

    我试过了 horizontalStackView1.distribution , horizontalStackView1.alignment

    我如何做到这一点?

    提前谢谢!

    代码如下所示(顺便说一下,它是一个表的单元格):

    class ItemTableViewCell: UITableViewCell
    {
        ...
        let stateLabel = UILabel()
        let effectiveDateLabel = UILabel()
        ...
    
        var typeImage: UIImage?
        {
            ...
        }
    
        var summary: String?
        {
            ...
        }
    
        var effectiveDate: Date?
        {
            ...
        }
    
        override init(style: UITableViewCellStyle, reuseIdentifier: String?)
        {
            super.init(style: style, reuseIdentifier: reuseIdentifier)
            self.accessoryType = .disclosureIndicator
            ...
            let horizontalStackView1 = UIStackView(arrangedSubviews: [self.stateLabel, self.effectiveDateLabel])
            let horizontalStackView2 = UIStackView(arrangedSubviews: [typeImageViewWrapper, self.titleLabel])
            horizontalStackView2.spacing = 4
            let verticalStackView = UIStackView(arrangedSubviews: [horizontalStackView1, horizontalStackView2, self.summaryLabel])
            verticalStackView.axis = .vertical
            verticalStackView.spacing = 4
            self.contentView.addSubview(verticalStackView)
            ...
        }
    
        required init?(coder aDecoder: NSCoder)
        {
            fatalError()
        }
    }
    
    2 回复  |  直到 7 年前
        1
  •  5
  •   Michal Klein    7 年前

    这是因为UIStackView选择第一个包含最低内容优先级的arrangedSubview,并调整它的大小,这样stackview的内容就占据了整个宽度。

    如果你想在这种情况下使用UIStackView,你可以改变内容优先权,例如。

    label2.setContentHuggingPriority(.defaultLow, for: .horizontal)
    label1.setContentHuggingPriority(.defaultHigh, for: .horizontal)
    
        2
  •  0
  •   zisoft    7 年前

    stackviews分布应设置为 fillProportionally 所以每个排列的子视图都保持其比例。

    但是,剩余空间将由stackview自动填充。要抑制这种情况,需要在末尾添加一个空视图。这个空视图需要一个较低的包含内容的优先级,这样它就可以按比例填充其他视图所占的空间。

    此外,空视图需要一个intrinsicContentSize,以便stackview计算维度:

    class FillView: UIView {
        override var intrinsicContentSize: CGSize {
            get { return CGSize(width: 100, height: 100) }
        }
    }
    

    let fillView: UIFillView()
    fillView.setContentHuggingPriority(priority: .fittingSizeLevel, for: .horizontal)
    myStackView.addArrangedSubview(fillView)
    

    spacing 以保持子视图之间的距离。