swift - 为stackView中的项目设置最大高度的约束

Question

如图所示，我有一个带有 UiViews 框的 stackView。我想为里面的盒子设置一个 50 或更小的最大高度，因为它们现在看起来太大了，但我也想保持 1:1 的比例，这样它们就会是方形的。我试图为 stackView 设置一个高度约束，但是当我这样做时，1:1 的纵横比被忽略了。

这是它现在的样子：

这是代码：

let stackview = UIStackView(arrangedSubviews: letterBoxes)
        stackview.axis = .horizontal
        stackview.spacing = 5
        stackview.distribution = .fillEqually
        stackview.translatesAutoresizingMaskIntoConstraints = false
        self.view.addSubview(stackview)        
        NSLayoutConstraint.activate([
            stackview.topAnchor.constraint(equalTo: secondLine.bottomAnchor, constant: c/2 +
                20),
            stackview.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
            stackview.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 10)
            ])

        for box in letterBoxes{
            box.aspectRation(1.0/1.0).isActive = true
        }

编辑：我希望盒子自动调整大小并且不会像下面那样溢出（每次都有不同数量的盒子。所以例如，当只有 3 个盒子时，我希望最大尺寸为 50，但当有 6 个或更大的数字我希望它自动调整大小，以便它适合屏幕并且不会溢出。一旦我取消了领先的约束，它就会溢出）：

标签： swiftxcode

Answer 1

以下将完成这项工作。

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()

        let letterBoxes = [UIView(), UIView(), UIView()]
        for box in letterBoxes {
            box.translatesAutoresizingMaskIntoConstraints = false
            box.backgroundColor = .systemBlue
            view.addSubview(box)

            let heightConstraint = box.heightAnchor
                .constraint(equalToConstant: 50)
            heightConstraint.priority = .defaultHigh

            NSLayoutConstraint.activate([
                box.widthAnchor.constraint(equalTo: box.heightAnchor),
                heightConstraint
            ])
        }

        let stackview = UIStackView(arrangedSubviews: letterBoxes)
        stackview.axis = .horizontal
        stackview.spacing = 5
        stackview.distribution = .fillEqually
        stackview.alignment = .center
        stackview.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(stackview)

        NSLayoutConstraint.activate([
            stackview.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            stackview.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            stackview.leadingAnchor.constraint(
                greaterThanOrEqualTo: view.leadingAnchor,
                constant: 10
            ),
            stackview.trailingAnchor.constraint(
                lessThanOrEqualTo: view.trailingAnchor,
                constant: -10
            )
        ])
    }
}

关键是使框的 s 的优先级heighConstraint小于required。所以当盒子不多的时候，它们的大小是 50，但是当盒子很多时，高度限制将被忽略。

另请注意，stackview'sleadingAnchor和trailingAnchor约束将框保持在屏幕边界内。

以下屏幕截图显示了结果：