Swift: 堆栈视图未显示完整的子视图

Question

我有一个子视图：

这是该视图的子 class：

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 尊重子视图的大小并增加堆栈视图的高度，以便子视图看起来正常而不压缩？

非常感谢你的帮助。

Answer 1

您需要考虑两件事：

你的红色和蓝色的高度和宽度是多少views？您在问题中包含的代码没有显示这些 views 有您设置的任何 frame 除了 .zero 所以首先您需要给它们适当的高度以便 [=15= 考虑]
你需要设置UIStackViewdistribution..你的视图distribute在stackView中如何设置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 的高度约束

Answer 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)

截图：

Swift: 堆栈视图未显示完整的子视图

Swift: Stack View not showing complete subviews

stack

ios

swift

uistackview

xcode11.4