UIStackView 间距不适用于具有基线对齐的嵌套堆栈视图
UIStackView spacing not working for nested stack views with baseline alignment
我正在尝试在垂直 UIStackView 中包含一系列 UITextField 以及相应的 UILabel。我将每个 label/field 对嵌套在一个水平的 UIStackView 中,并且标签的宽度被硬编码为所有标签的最宽固有宽度,以便它们很好地排列。
它几乎可以工作,但是水平堆栈视图没有像预期的那样均匀分布(间距 = 5)并且聚成一团并重叠。
但是,如果我删除行 hFieldStack.alignment = .lastBaseline
,那么一切都会完美无缺。
我同意删除该行,因为它看起来不错。但我很好奇为什么在嵌套堆栈视图中使用 lastBaseline 对齐时外部堆栈视图中的间距不起作用。
stackView.axis = .vertical
stackView.spacing = 5
stackView.layoutMargins = UIEdgeInsets(top: 5, left: 0, bottom: 0, right: 0)
stackView.isLayoutMarginsRelativeArrangement = true
if let titleLabel = titleLabel {
stackView.addArrangedSubview(titleLabel)
}
if let messageLabel = messageLabel {
stackView.addArrangedSubview(messageLabel)
}
if textFields.count == fieldLabels.count {
for i in 0..<textFields.count {
fieldLabels[i].widthAnchor.constraint(equalToConstant: 80).isActive = true
let hFieldStack = UIStackView()
hFieldStack.translatesAutoresizingMaskIntoConstraints = false
hFieldStack.axis = .horizontal
hFieldStack.alignment = .lastBaseline
hFieldStack.spacing = 5
hFieldStack.layoutMargins = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
hFieldStack.isLayoutMarginsRelativeArrangement = true
hFieldStack.addArrangedSubview(fieldLabels[i])
hFieldStack.addArrangedSubview(textFields[i])
stackView.addArrangedSubview(hFieldStack)
}
} else {
logger.error("Field count doesn't match label count")
}
好奇...
看来,当将水平堆栈视图的对齐方式设置为 .lastBaseline
(也发生在 .firstBaseline
时),自动布局正在使用文本字段的 _UITextFieldCanvasView
计算布局。
因此,对于圆角矩形边框,文本字段的实际框架比 _UITextFieldCanvasView
.
高
我们可以通过检查视图层次结构来确认这一点:
标签很好地基线对齐与_UITextFieldCanvasView
中呈现的文本......但框架显然延伸到堆栈视图的框架之外。
虽然 docs 将 .lastBaseline
列为。有效的对齐常量,这有点说明,在 Storyboard / Interface Builder 中,唯一的对齐选项是 Fill
、Leading
、Center
和 Trailing
.
我遇到过几个与 StackViews 相关的实际 Bug --- 所以我想我会(个人)将这个添加到列表中。
我正在尝试在垂直 UIStackView 中包含一系列 UITextField 以及相应的 UILabel。我将每个 label/field 对嵌套在一个水平的 UIStackView 中,并且标签的宽度被硬编码为所有标签的最宽固有宽度,以便它们很好地排列。
它几乎可以工作,但是水平堆栈视图没有像预期的那样均匀分布(间距 = 5)并且聚成一团并重叠。
但是,如果我删除行 hFieldStack.alignment = .lastBaseline
,那么一切都会完美无缺。
我同意删除该行,因为它看起来不错。但我很好奇为什么在嵌套堆栈视图中使用 lastBaseline 对齐时外部堆栈视图中的间距不起作用。
stackView.axis = .vertical
stackView.spacing = 5
stackView.layoutMargins = UIEdgeInsets(top: 5, left: 0, bottom: 0, right: 0)
stackView.isLayoutMarginsRelativeArrangement = true
if let titleLabel = titleLabel {
stackView.addArrangedSubview(titleLabel)
}
if let messageLabel = messageLabel {
stackView.addArrangedSubview(messageLabel)
}
if textFields.count == fieldLabels.count {
for i in 0..<textFields.count {
fieldLabels[i].widthAnchor.constraint(equalToConstant: 80).isActive = true
let hFieldStack = UIStackView()
hFieldStack.translatesAutoresizingMaskIntoConstraints = false
hFieldStack.axis = .horizontal
hFieldStack.alignment = .lastBaseline
hFieldStack.spacing = 5
hFieldStack.layoutMargins = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
hFieldStack.isLayoutMarginsRelativeArrangement = true
hFieldStack.addArrangedSubview(fieldLabels[i])
hFieldStack.addArrangedSubview(textFields[i])
stackView.addArrangedSubview(hFieldStack)
}
} else {
logger.error("Field count doesn't match label count")
}
好奇...
看来,当将水平堆栈视图的对齐方式设置为 .lastBaseline
(也发生在 .firstBaseline
时),自动布局正在使用文本字段的 _UITextFieldCanvasView
计算布局。
因此,对于圆角矩形边框,文本字段的实际框架比 _UITextFieldCanvasView
.
我们可以通过检查视图层次结构来确认这一点:
标签很好地基线对齐与_UITextFieldCanvasView
中呈现的文本......但框架显然延伸到堆栈视图的框架之外。
虽然 docs 将 .lastBaseline
列为。有效的对齐常量,这有点说明,在 Storyboard / Interface Builder 中,唯一的对齐选项是 Fill
、Leading
、Center
和 Trailing
.
我遇到过几个与 StackViews 相关的实际 Bug --- 所以我想我会(个人)将这个添加到列表中。