【问题标题】:UIStackView dynamcially add 2 labels next to each other with no extra spacingUIStackView 动态添加 2 个彼此相邻的标签,没有额外的间距
【发布时间】:2018-09-13 11:41:13
【问题描述】:

我是 iOS 开发新手,对如何实现这一点有点困惑。

我有 2 个 UILabels 添加到 UIStackView 中,如下所示:

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

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

但是,我希望标签彼此相邻,中间没有空格,如下所示:

我尝试设置horizontalStackView1.distributionhorizontalStackView1.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()
    }
}

【问题讨论】:

  • 这里绝对需要堆栈视图吗?
  • @inokey 不一定要配对,我只需要将视图水平添加到彼此旁边
  • 如何添加 stackView 、 frame 或 autolayout 显示代码
  • 当您需要分布式内容等时,堆栈非常好。但是当你只需要连续排列两个视图时,我会使用普通的自动布局。第一个标签导致超级视图领先,第二个标签导致第一个标签尾随。
  • @inokey 大声笑听起来不错,但对我来说都是胡言乱语,我来自 android 大声笑

标签: ios swift uilabel uistackview


【解决方案1】:

这是因为 UIStackView 选择了第一个具有最低内容拥抱优先级的排列子视图,并调整了它的大小,以便堆栈视图的内容占据整个宽度。

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

label2.setContentHuggingPriority(.defaultLow, for: .horizontal)
label1.setContentHuggingPriority(.defaultHigh, for: .horizontal)

【讨论】:

  • 这很接近,但现在它们就像彼此相邻,出于可读性原因,我确实希望在 2 个标签之间留一点空间
  • 感谢我的伙伴,我刚刚为 UIStackView 添加了一些间距,一切都很好:)!
【解决方案2】:

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

但是,剩余空间由 stackview 自动填充。为了抑制这种情况,您需要在最后添加一个空视图。这个空视图需要较低的内容拥抱优先级,以便它可以增长以按比例填充其他视图保留的空间。

此外,空视图需要一个 intrinsicContentSize 来让 stackview 计算尺寸:

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

现在设置您排列的子视图并将 fillView 放在最后

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

将堆栈视图spacing 设置为您的需要,以保持子视图之间的距离。

【讨论】:

    猜你喜欢
    • 2017-12-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-10-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多