UIStackView：将子视图推到边缘（“无限”间距）

Question

我正在使用UIStackView来定义列表的布局。

我正在努力达到类似的效果：

||Item1---spacing---Item2||

因此，这两个项目正被推到UIStackView。

的两侧

但是，这些项目会在distribution和alignment的每种可能组合中组合在一起：

||Item1-Item2-----spacing-----||

我尝试设置一个较大的间距值，即500.在这种情况下，Item2只是偏离屏幕。

有没有办法将Item1和Item2“绑定”到UIStackView的左侧和右侧，同时允许间距根据屏幕宽度而改变？

Answer 1

UIStackView折叠并将其内部内容大小设置为其子视图和间距的总和。

通过添加一组约束来＆＃34;拉伸＆＃34; UIStackView，我设法得到了我想要的效果：

hStack.snp.makeConstraints { (make) in
  make.leading.trailing.equalToSuperview()
}

Answer 2

实现这一目标的一种可能方法是在两个视图之间添加“间距”视图，并确保视图的拥抱优先级大于间距一（当然，它们将具有有效的内部大小）或定义其宽度的约束。这是一个快速的游乐场，我把它放在一起测试这个：

import UIKit
import PlaygroundSupport

class MyViewController : UIViewController {
    override func loadView() {
        let view = UIView()
        view.backgroundColor = .white

        let label1 = UILabel()
        label1.translatesAutoresizingMaskIntoConstraints = false
        label1.text = "Left"
        label1.backgroundColor = .red
        label1.setContentHuggingPriority(.required, for: .horizontal)

        let label2 = UILabel()
        label2.translatesAutoresizingMaskIntoConstraints = false
        label2.text = "Right"
        label2.backgroundColor = .green
        label2.setContentHuggingPriority(.required, for: .horizontal)

        let stack = UIStackView(arrangedSubviews: [label1, UIView(), label2])
        stack.translatesAutoresizingMaskIntoConstraints = false
        stack.distribution = .fill
        stack.axis = .horizontal

        view.addSubview(stack)

        stack.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
        stack.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
        stack.topAnchor.constraint(equalTo: view.topAnchor).isActive = true


        self.view = view
    }
}
// Present the view controller in the Live View window
PlaygroundPage.current.liveView = MyViewController()

产生这个：

注意：有趣的是，我的示例中的结果保持不变，即使根本没有设置标签的拥抱优先级（我很想知道为什么会发生这种情况顺便说一句。我的猜测是因为它们具有非零的内在内容大小（？）），但决定留下代码以证明其背后的原理。