Swift NSlayoutConstraint

Question

我有个问题..。我真的不明白什么。我有一个UIView类，它只创建一个UITextLabel。我试图将这个类中的实例添加到我的视图控制器中。这就是我的UIViewClass的样子：

    class PostLineItem: UIView {


    var labelText : String!
    var labelHeader : String!

    init(labelText: String , labelHeader: String) {
        super.init(frame: CGRect.zeroRect)
        self.labelText = labelText
        self.labelHeader = labelHeader
        let tlb = timeLineBlock()
        //tlb.setTranslatesAutoresizingMaskIntoConstraints(false)
        self.addSubview(tlb)
        NSLayoutConstraint.activateConstraints([
            NSLayoutConstraint(item: tlb, attribute: .Height, relatedBy: .Equal, toItem: self, attribute: .Height, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Width, relatedBy: .Equal, toItem: self, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Left, relatedBy: .Equal, toItem: self, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Top, relatedBy: .Equal, toItem: self, attribute: .Top, multiplier: 1.0, constant: 0)
            ])

    }

    required init(coder aDecoder: NSCoder) {

        super.init(coder: aDecoder)
        println("required public")
    }


    private func timeLineBlock() -> UIView{

        let viewNew = UIView()
        viewNew.setTranslatesAutoresizingMaskIntoConstraints(false)


        let titleLabel = UILabel()
        titleLabel.setTranslatesAutoresizingMaskIntoConstraints(false)
        titleLabel.font = UIFont(name: "ArialMT", size: 20)
        titleLabel.textColor = UIColor.blackColor()
        titleLabel.text = labelHeader
        titleLabel.numberOfLines = 0
        viewNew.addSubview(titleLabel)
        titleLabel.backgroundColor = UIColor.redColor()

        /* IF I NOT COMMENT THIS PART INSTANCE OF THIS CLASS IS NOT SHOWING UP.
        viewNew.addConstraints([
            NSLayoutConstraint(item: titleLabel, attribute: .Width, relatedBy: .Equal, toItem: viewNew, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: titleLabel, attribute: .Left, relatedBy: .Equal, toItem: viewNew, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: titleLabel, attribute: .Top, relatedBy: .Equal, toItem: viewNew, attribute: .Top, multiplier: 1.0, constant: 0)
            ])
       */ 

        viewNew.backgroundColor = UIColor.greenColor()
        return viewNew

    }

}

这是我的viewController类部分，我尝试实例化PostLineItem实例。

 let guideView = UIView()
    guideView.setTranslatesAutoresizingMaskIntoConstraints(false)
    guideView.backgroundColor = UIColor.blackColor()
    scrollView.addSubview(guideView)

    scrollView.addConstraints([
        NSLayoutConstraint(item: guideView, attribute: .Top, relatedBy: .Equal, toItem: scrollView, attribute: .Top, multiplier: 1.0, constant: 50),
        NSLayoutConstraint(item: guideView, attribute: .Left, relatedBy: .Equal, toItem: scrollView, attribute: .Left, multiplier: 1.0, constant: 0),
        NSLayoutConstraint(item: guideView, attribute: .Width, relatedBy: .Equal, toItem: scrollView, attribute: .Width, multiplier: 1.0, constant: -30),
        NSLayoutConstraint(item: guideView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant:10)
        ])



guideView.backgroundColor = UIColor.blackColor()


var viewFromAbove = guideView


for post in 1...70 {

    let v = PostLineItem(labelText: "Tst", labelHeader: "Tst2")
    scrollView.addSubview(v)

    NSLayoutConstraint.activateConstraints([
        NSLayoutConstraint(item: v, attribute: .Top, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Bottom, multiplier: 1.0, constant: 15),
        NSLayoutConstraint(item: v, attribute: .Left, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Left, multiplier: 1.0, constant: 0),
        NSLayoutConstraint(item: v, attribute: .Width, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Width, multiplier: 1.0, constant: 0),
                 NSLayoutConstraint(item: v, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 400)
        ])
    viewFromAbove = v
    }

    scrollView.addConstraints([
    NSLayoutConstraint(item: viewFromAbove, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: scrollView, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: -10)
    ])

如您所见，首先我为第一个PostLineItem创建一个指导视图，然后添加新的实例和约束。所以..。

如果我这样做，PostLineItem类的实例将位于相同的位置，并相互隐藏.我认为，NSLAyoutConstaint不起作用。

但是，正如您可以在代码的注释部分看到的那样，如果我创建一个简单的UILabel，约束就能正常工作，所有的UILabel实例都将在彼此下面。

更新:在我把所有写在答案中的内容加起来后，它看起来如下..:(

​

那个小红方格是我的PostLineItem实例。:(

更新-所有代码。

Answer 1

我认为您可能是在向错误的视图中添加约束。例如，应该将guideView高度约束添加到guideView，而不是scrollView。我建议您使用激活约束的新方法。而不是将它们添加到视图中，只需调用NSLayoutConstraint上的NSLayoutConstraint类方法

NSLayoutConstraint.activateConstraints([
            NSLayoutConstraint(item: guideView, attribute: .Top, relatedBy: .Equal, toItem: scrollView, attribute: .Top, multiplier: 1.0, constant: 24),
            NSLayoutConstraint(item: guideView, attribute: .Left, relatedBy: .Equal, toItem: scrollView, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: guideView, attribute: .Width, relatedBy: .Equal, toItem: scrollView, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: guideView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant:4)
            ])

和

NSLayoutConstraints.activateConstraints([
            NSLayoutConstraint(item: v, attribute: .Top, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Bottom, multiplier: 1.0, constant: 5),
            NSLayoutConstraint(item: v, attribute: .Left, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: v, attribute: .Width, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Width, multiplier: 1.0, constant: 0),
            ])

此外，您还缺少了PostLineItem高度的约束，类似于：

NSLayoutConstraint(item: v, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant:10)

在PostLineItem init中，需要为timeLineBlock添加约束

init(labelText: String , labelHeader: String) {
    super.init(frame: CGRect.zeroRect)
    self.labelText = labelText
    self.labelHeader = labelHeader
    let tlb = timeLineBlock()
    self.addSubview(tlb)
    NSLayoutConstraint.activateConstraints([
        NSLayoutConstraint(item: tlb, attribute: .Height, relatedBy: .Equal, toItem: self, attribute: .Height, multiplier: 1.0, constant: 0),
        NSLayoutConstraint(item: tlb, attribute: .Width, relatedBy: .Equal, toItem: self, attribute: .Width, multiplier: 1.0, constant: 0),
        NSLayoutConstraint(item: tlb, attribute: .Left, relatedBy: .Equal, toItem: self, attribute: .Left, multiplier: 1.0, constant: 0),
        NSLayoutConstraint(item: tlb, attribute: .Top, relatedBy: .Equal, toItem: self, attribute: .Top, multiplier: 1.0, constant: 0)
    ])
}

这是我的版本。我得到了更好的结果。看看..。注意，我完全在Interface中设置了我的scrollView，并添加了一个名为scrollView的插座，它指向由scrollView包含的contentView。那应该不重要。其他一切都与您实现的一样。

class PostLineItem: UIView {


    var labelText : String!
    var labelHeader : String!

    init(labelText: String , labelHeader: String) {
        super.init(frame: CGRect.zeroRect)
        self.labelText = labelText
        self.labelHeader = labelHeader
        let tlb = timeLineBlock()
        self.addSubview(tlb)
        NSLayoutConstraint.activateConstraints([
            NSLayoutConstraint(item: tlb, attribute: .Height, relatedBy: .Equal, toItem: self, attribute: .Height, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Width, relatedBy: .Equal, toItem: self, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Left, relatedBy: .Equal, toItem: self, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: tlb, attribute: .Top, relatedBy: .Equal, toItem: self, attribute: .Top, multiplier: 1.0, constant: 0)
        ])
    }

    required init(coder aDecoder: NSCoder) {

        super.init(coder: aDecoder)
        println("required public")
    }


    private func timeLineBlock() -> UIView{

        let viewNew = UIView()
        viewNew.setTranslatesAutoresizingMaskIntoConstraints(false)


        let titleLabel = UILabel()
        titleLabel.setTranslatesAutoresizingMaskIntoConstraints(false)
        titleLabel.font = UIFont(name: "ArialMT", size: 20)
        titleLabel.textColor = UIColor.blackColor()
        titleLabel.text = labelHeader
        titleLabel.numberOfLines = 0
        viewNew.addSubview(titleLabel)
        titleLabel.backgroundColor = UIColor.redColor()

        NSLayoutConstraint.activateConstraints([
            NSLayoutConstraint(item: titleLabel, attribute: .Width, relatedBy: .Equal, toItem: viewNew, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: titleLabel, attribute: .Left, relatedBy: .Equal, toItem: viewNew, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: titleLabel, attribute: .Top, relatedBy: .Equal, toItem: viewNew, attribute: .Top, multiplier: 1.0, constant: 0)
        ])

        viewNew.backgroundColor = UIColor.greenColor()
        return viewNew
    }
}

class ViewController: UIViewController {

    @IBOutlet weak var scrollView: UIView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let guideView = UIView()
        guideView.setTranslatesAutoresizingMaskIntoConstraints(false)
        guideView.backgroundColor = UIColor.blackColor()
        scrollView.addSubview(guideView)
        NSLayoutConstraint.activateConstraints([
            NSLayoutConstraint(item: guideView, attribute: .Top, relatedBy: .Equal, toItem: scrollView, attribute: .Top, multiplier: 1.0, constant: 24),
            NSLayoutConstraint(item: guideView, attribute: .Left, relatedBy: .Equal, toItem: scrollView, attribute: .Left, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: guideView, attribute: .Width, relatedBy: .Equal, toItem: scrollView, attribute: .Width, multiplier: 1.0, constant: 0),
            NSLayoutConstraint(item: guideView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant:4)
            ])
        guideView.backgroundColor = UIColor.blackColor()
        var viewFromAbove = guideView


        for post in 1...70 {

            let v = PostLineItem(labelText: "Tst", labelHeader: "Tst2")

            //let v = UILabel(frame: CGRectMake(0, 0, 10, 10))
            //v.text = "Tst Now with this its working, and the constraint is fine."

            v.setTranslatesAutoresizingMaskIntoConstraints(false)

            scrollView.addSubview(v)

            NSLayoutConstraint.activateConstraints([
                NSLayoutConstraint(item: v, attribute: .Top, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Bottom, multiplier: 1.0, constant: 5),
                NSLayoutConstraint(item: v, attribute: .Left, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Left, multiplier: 1.0, constant: 0),
                NSLayoutConstraint(item: v, attribute: .Width, relatedBy: .Equal, toItem: viewFromAbove, attribute: .Width, multiplier: 1.0, constant: 0),
                NSLayoutConstraint(item: v, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant:30)
                ])

            viewFromAbove = v
        }
    }
}

​

​