stackview如何动态更改嵌套在其中的元素之间的间距

Question

几个月以来，我一直在努力围绕stackview及其工作原理。因此，我创建了一个项目，该项目在堆栈视图中嵌套了4个按钮，宽度和高度均保持不变。现在，根据iPhone屏幕的大小，我希望stackview内的按钮保持其宽度和大小，但它们之间的间距要变小或变大。如果我使用鼠标手动调整stackview大小，则可完美完成此操作。但是，当我添加应该具有相同效果的顶部和底部约束时，即使堆栈视图中的按钮都具有恒定的高度（将优先级设置为1000），它们也会缩小或奇怪地拉伸。

您可以自己创建一个带有一些按钮的堆栈视图，然后设置其宽度和高度常数，以亲自尝试。然后添加顶部和底部约束，并在比创建它的屏幕尺寸小的屏幕上预览。

在iPhone XS上预览，如果屏幕较小，则按钮之间的间距应动态更改为更大或更小：

在iPhone 8上预览：

以及它的外观：

任何人都可以向我解释为什么会发生这种情况以及如何获得想要的结果吗？

Answer 1

您应该只向UIStackView添加高度约束，而不是添加底部约束，请按照以下示例进行操作

let buttons = [UIButton(), UIButton(), UIButton(), UIButton()]
for (index, button) in buttons.enumerated() {
    button.backgroundColor = .red
    button.setTitle("Category Button \(index)", for: .normal)
    button.setTitleColor(.black, for: .normal)
}
let stackView = UIStackView(arrangedSubviews: buttons)
stackView.axis = .vertical
stackView.distribution = .equalSpacing
stackView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(stackView)

let salGuide = self.view.safeAreaLayoutGuide
NSLayoutConstraint.activate([
    stackView.topAnchor.constraint(equalTo: salGuide.topAnchor, constant: 16.0),
    stackView.centerXAnchor.constraint(equalTo: salGuide.centerXAnchor, constant: 0),
    stackView.widthAnchor.constraint(equalTo: salGuide.widthAnchor, multiplier: 0.6),
    stackView.heightAnchor.constraint(equalTo: salGuide.heightAnchor, multiplier: 0.6)
])

请注意，multiplier: 0.6为UIStackView提供了60％的可用宽度和高度，要使用恒定的宽度/高度，只需将参数名称从multiplier更改为constant并提供适当的参数值。

iPhone SE

iPhone Xs Max