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

Swift: Stack View not showing complete subviews

我有一个子视图:

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

非常感谢你的帮助。

您需要考虑两件事:

  1. 你的红色和蓝色的高度和宽度是多少views?您在问题中包含的代码没有显示这些 views 有您设置的任何 frame 除了 .zero 所以首先您需要给它们适当的高度以便 [=15= 考虑]

  2. 你需要设置UIStackViewdistribution..你的视图distributestackView中如何设置constraint这样的堆栈不固定它的高度.. 如果你固定 UIStackView 高度,它会尝试在那个高度

    布局子视图

所以你需要的是给你的视图高度 constraint 并设置你的 stackViewdistribution 不固定 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 的高度约束

首先创建一个方法来创建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)

截图: