如何在我的UITable单元格上设置适当的约束。迅捷4

时间:2019-03-15 19:12:18

标签: ios swift uitableview constraints

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

我有一个表格,它使用数组填充。我有三个子视图,每个子视图都必须放在彼此下面。这是我得到的结果:

enter image description here

您可以看到我的橙色单元格的一部分被红色单元格切断了。 (我尝试了其他多种约束,但这是我达到所需效果的最接近的约束。

我确实知道为什么会这样。这是因为我在mainView的topAnchor上放置了一个bottomAnchor在mainView上,并且我对commentView也做了相同的操作。

我认为适当的设置是将约束更改为:

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

但是这会将mainView从屏幕上删除。导致:

enter image description here

我怎样才能让它们整齐地放在下面?

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
    }

所需的结果将是这样的:

enter image description here

1 个答案:

答案 0 :(得分:0)

好吧,我明白了。通过使用以下添加的代码将其更改为stackview来解决该问题:

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

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