ios - NSLayoutConstraint 将 View 固定到父 View 的底部边缘

Question

一个可重现的例子

class ViewController: UIViewController {

   var created = false

   override func viewDidLayoutSubviews() {
      super.viewDidLayoutSubviews()
      if !created {

         let scrollView = UIScrollView()
         scrollView.backgroundColor = UIColor.grayColor()
         view.addSubview(scrollView)

         let kidView = UIView()
         kidView.backgroundColor = UIColor.redColor()
         kidView.translatesAutoresizingMaskIntoConstraints = false

         scrollView.addSubview(kidView)

         scrollView.translatesAutoresizingMaskIntoConstraints = false
         kidView.translatesAutoresizingMaskIntoConstraints = false

         view.addConstraints(
            NSLayoutConstraint.constraintsWithVisualFormat("H:|[scrollView]|", options: .AlignAllLeft, metrics: nil, views: ["scrollView": scrollView])
         )
         view.addConstraints(
            NSLayoutConstraint.constraintsWithVisualFormat("V:|[scrollView]|", options: .AlignAllLeft, metrics: nil, views: ["scrollView": scrollView])
         )

         kidView.addConstraints([
            NSLayoutConstraint(item: kidView, attribute: .Width, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1, constant: 100),
            NSLayoutConstraint(item: kidView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1, constant: 100),
         ])

         scrollView.addConstraints([
            NSLayoutConstraint(item: kidView, attribute: .CenterX, relatedBy: .Equal, toItem: scrollView, attribute: .CenterX, multiplier: 1, constant: 0),
            NSLayoutConstraint(item: kidView, attribute: .Bottom, relatedBy: .Equal, toItem: scrollView, attribute: .Bottom, multiplier: 1, constant: 0),
//            NSLayoutConstraint(item: kidView, attribute: .CenterY, relatedBy: .Equal, toItem: scrollView, attribute: .CenterY, multiplier: 1, constant: 0),
         ])

         created = true
      }
   }

}

问题

我想将我的自定义 View 对齐到我的 UIScrollView 的底部边缘，但我似乎只能将它对齐到顶部或垂直中心。

scrollView.addConstraints([
    NSLayoutConstraint(
        item: circleContainerView, 
        attribute: .Top, 
        relatedBy: .Equal, 
        toItem: scrollView, 
        attribute: .Top, 
        multiplier: 1, 
        constant: 0),
])

scrollView.addConstraints([
    NSLayoutConstraint(
        item: circleContainerView, 
        attribute: .CenterY, 
        relatedBy: .Equal, 
        toItem: scrollView, 
        attribute: .CenterY, 
        multiplier: 1, 
        constant: 0),
])

但是我想要的是有这样一张图片。我如何到达那里？

Answer 1

具有自动布局的 ScrollView 的工作方式不同，您可以通过设置 translatesAutoresizingMaskIntoConstraints = true 并显式设置 contentSize 来仅使用一个 subview 。或者你设置 translatesAutoresizingMaskIntoConstraints = false 让它自己找出约束。

在您的情况下，您可以在 scroll 内添加一个不可见 View 并将其固定到顶部并将其高度设置为 scrollView.bounds.size.height 然后使用该不可见 View 设置创建约束

像这样改变你的约束

scrollView.addConstraints([
    NSLayoutConstraint(
        item: circleContainerView, 
        attribute: .Bottom, 
        relatedBy: .Equal, 
        toItem: invisibleView, 
        attribute: .Bottom, 
        multiplier: 1, 
        constant: 0),
])

访问此 link有关详细信息，请阅读纯自动布局方法

更新:您修改后的代码

class ViewController: UIViewController {

    var created = false

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        if !created {

            let scrollView = UIScrollView()
            scrollView.backgroundColor = UIColor.grayColor()
            view.addSubview(scrollView)

            let kidView = UIView()
            kidView.backgroundColor = UIColor.redColor()

            scrollView.addSubview(kidView)

            scrollView.translatesAutoresizingMaskIntoConstraints = false
            kidView.translatesAutoresizingMaskIntoConstraints = false

            scrollView.frame = view.bounds;
            scrollView.contentSize = view.bounds.size

            // Add an invisible view

            let inV = UIView()
            inV.backgroundColor = UIColor.clearColor()
            inV.translatesAutoresizingMaskIntoConstraints = false
            scrollView.addSubview(inV)


            view.addConstraints(
                NSLayoutConstraint.constraintsWithVisualFormat("H:|[scrollView]|", options: .AlignAllLeft, metrics: nil, views: ["scrollView": scrollView])
            )
            view.addConstraints(
                NSLayoutConstraint.constraintsWithVisualFormat("V:|[scrollView]|", options: .AlignAllLeft, metrics: nil, views: ["scrollView": scrollView])
            )

            var constraint = NSLayoutConstraint(item: inV, attribute: .Top, relatedBy: .Equal, toItem: scrollView, attribute: .Top, multiplier: 1, constant: 0)

            view.addConstraint(constraint)

            constraint = NSLayoutConstraint(item: inV, attribute: .Left, relatedBy: .Equal, toItem: scrollView, attribute: .Left, multiplier: 1, constant: 0)
            view.addConstraint(constraint)

            inV.addConstraints([
                NSLayoutConstraint(item: inV, attribute: .Width, relatedBy: .Equal, toItem: nil, attribute: .Width, multiplier: 1, constant: 10),
                NSLayoutConstraint(item: inV, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .Height, multiplier: 1, constant: self.view.bounds.size.height),
                ])

            //

            kidView.addConstraints([
                NSLayoutConstraint(item: kidView, attribute: .Width, relatedBy: .Equal, toItem: nil, attribute: .Width, multiplier: 1, constant: 100),
                NSLayoutConstraint(item: kidView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .Height, multiplier: 1, constant: 100),
                ])

            view.addConstraints([
                NSLayoutConstraint(item: kidView, attribute: .CenterX, relatedBy: .Equal, toItem: scrollView, attribute: .CenterX, multiplier: 1, constant: 0),
                NSLayoutConstraint(item: kidView, attribute: .Bottom, relatedBy: .Equal, toItem: inV, attribute: .Bottom, multiplier: 1, constant: 0),
                ])

            created = true
        }
    }

}