Swift：堆栈视图未显示完整的子视图答案

【问题标题】：Swift: Stack View not showing complete subviewsSwift：堆栈视图未显示完整的子视图
【发布时间】：2020-10-21 09:59:45
【问题描述】：

我有一个子视图：

这是该视图的子类：

class MyView: UIView {
    public init(){
        super.init(frame: .zero)
    }
    
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }
}

在我的主视图控制器上，我有一个 stackView：

如果我将单个视图添加到堆栈视图：

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    generaRedView()
}

func generaRedView() {
    let newView = MyView()
    newView.backgroundColor = .red
    stackView.addArrangedSubview(newView)
}

看起来还不错：

但我在堆栈视图中添加了两个视图：

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        generaRedView()
        generaBlueView()
    }
    
    func generaRedView() {
        let newView = MyView()
        newView.backgroundColor = .red
        stackView.addArrangedSubview(newView)
    }
    
    func generaBlueView() {
        let newView = MyView()
        newView.backgroundColor = .blue
        stackView.addArrangedSubview(newView)
    }

子视图被压缩：

我的问题是如何让 stackView 尊重子视图的大小并增加堆栈视图的高度，以便子视图看起来正常而不压缩？

非常感谢您的帮助。

【问题讨论】：

您是否正确配置了stackView？请分享您的整个代码。
您必须添加要添加到 StackView 的子视图的高度。如果您不想定义子视图的高度，或者给 StackView 提供静态高度。

标签： ios swift stack uistackview xcode11.4

【解决方案1】：

您需要考虑两件事：

你的红色和蓝色views的高度和宽度是多少？您在问题中包含的代码并未显示这些views 具有除.zero 以外的任何frame，因此首先您需要给它们适当的高度以供UIStackView 考虑
您需要设置UIStackView distribution.. 您在stackView 中的视图distribute 并设置堆栈的constraint 以便不固定其高度.. 如果您修复UIStackView 高度，它将尝试以该高度布局子视图

所以你需要给你的视图高度constraint 并设置你的stackView 的distribution 和不固定的height constraint：

func generaRedView() {
        let newView = MyView()
        newView.backgroundColor = .red

        newView.translatesAutoresizingMaskIntoConstraints = false
        newView.widthAnchor.constraint(equalToConstant: 100).isActive = true
        newView.heightAnchor.constraint(equalToConstant: 100).isActive = true
        stackView.addArrangedSubview(newView)
    }

这就是你如何给你的视图施加约束......并移除 stackView 的修复高度约束

【讨论】：

你能发帖和例子吗？
没有火箭科学先生...你能给出你的观点高度限制吗？

【解决方案2】：

首先创建一个方法来创建MyView 实例。其次，在将newView 添加到stackView 之前，添加一个高度 constraint 到它，即

func generateView(with color: UIColor, height: CGFloat) {
    let newView = MyView()
    newView.backgroundColor = color
    newView.translatesAutoresizingMaskIntoConstraints = false
    newView.heightAnchor.constraint(equalToConstant: height).isActive = true //here....
    stackView.addArrangedSubview(newView)
}

你可以像这样调用上面的方法，

generateView(with: .red, height: 80.0)
generateView(with: .blue, height: 180.0)

截图：

【讨论】：