ios - 如何对我的表格单元格设置适当的约束。 swift 4

Question

我是 Swift 新手，在为我的表设置适当的约束时遇到了一些麻烦。

我有一个使用数组填充的表。我有三个 subview ，需要将它们放置在彼此下方。这是我得到的结果:

正如你所看到的，我的橙色细胞的一部分被红色细胞切断了。 (我尝试了多种其他约束，但这是我最接近预期效果的。

我确实明白为什么会发生这种情况。这是因为我在parentView上放置了一个bottomAnchor，并在mainView上放置了一个topAnchor，并且我也对commentView做了同样的事情。

我认为正确的设置是将约束更改为:

parentView.bottomAnchor.constraint(equalTo: self.commentView.topAnchor).isActive = true
mainView.topAnchor.constraint(equalTo: self.parentView.bottomAnchor).isActive = true

但这会从屏幕上删除 mainView。结果是:

如何将它们整齐地放在一起？

override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?){
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.addSubview(commentView)
        self.addSubview(parentView)
        self.addSubview(mainView)

        parentView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
        parentView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
        parentView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
        parentView.bottomAnchor.constraint(equalTo: self.mainView.topAnchor).isActive = true
        parentView.heightAnchor.constraint(equalToConstant: 50).isActive = true


        mainView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
        mainView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
        mainView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
        mainView.heightAnchor.constraint(equalToConstant: 80).isActive = true



        commentView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
        commentView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
        commentView.topAnchor.constraint(equalTo: self.mainView.bottomAnchor).isActive = true
        commentView.heightAnchor.constraint(equalToConstant: 20).isActive = true
    }

期望的结果是这样的:

Answer 1

好的，我明白了。通过将其更改为堆栈 View 并添加以下代码来解决它:

var parentView : UITextView = {
    var textView = UITextView()
    textView.translatesAutoresizingMaskIntoConstraints  = false
    textView.isScrollEnabled = false
    textView.backgroundColor = orangeBanner
    textView.heightAnchor.constraint(equalToConstant: 50.0).isActive = true
    return textView

}()

var mainView : UITextView = {
    var textView = UITextView()
    textView.translatesAutoresizingMaskIntoConstraints  = false
    textView.backgroundColor = grayBanner
    textView.isScrollEnabled = false
    textView.heightAnchor.constraint(equalToConstant: 100.0).isActive = true
    return textView

}()

var commentView : UITextView = {
    var textView = UITextView()
    textView.translatesAutoresizingMaskIntoConstraints  = false
    textView.isScrollEnabled = false
    textView.backgroundColor = UIColor.red
    textView.heightAnchor.constraint(equalToConstant: 30.0).isActive = true
    return textView

}()

lazy var stackView: UIStackView = {
    let sv = UIStackView(arrangedSubviews: [parentView, mainView, commentView])
    sv.translatesAutoresizingMaskIntoConstraints = false
    sv.axis = .vertical
    sv.spacing = 0

    return sv

}()


self.addSubview(stackView)

stackView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
stackView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
stackView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
stackView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true

感谢您为我指明了正确的方向!