根據子視圖自動設置容器視圖的高度

Question

我知道這個問題已被問過無數次，但我似乎無法完全解決這個問題。

使用自動佈局，我想根據它的子視圖自動設置我的容器UIView的高度。我已經看過使用sizeToFit和其他各種方法來總結我的子視圖的高度，但從我讀過的高度來看，使用自動佈局時，我的容器高度應該是自動的，因爲子視圖「內在」內容大小。

下面是我遇到的一個簡化案例。我會很感激任何指導！

概述：

1. 創建容器的UIView，銷到左，上海華盈的右側，沒有明確的高度，對準其centerY與它的父centerY
2. 創建300寬度100高度的UIView，添加它作爲容器視圖的子視圖，將其centerX與容器視圖的centerX對齊，將其與容器視圖的頂部邊緣對齊
3. 重複步驟2，除了這次將其頂部固定到＃2的底部邊緣
4. 容器視圖的預期高度是200，除了它的高度是a ctually仍爲0（爲此centerY對齊關閉）

代碼：

class ViewController: UIViewController { 

    let redView = RedView() 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     view.addSubview(redView) 
     view.setNeedsUpdateConstraints() 
    } 

} 

class RedView: UIView { 

    let greenView = GreenView() 
    let blueView = BlueView() 

    init() { 
     super.init(frame: CGRect.zero) 

     translatesAutoresizingMaskIntoConstraints = false 
     backgroundColor = UIColor.red() 

     addSubview(greenView) 
     addSubview(blueView) 
     setNeedsUpdateConstraints() 
    } 

    override func updateConstraints() { 
     super.updateConstraints() 

     NSLayoutConstraint(item: greenView, attribute: .top, relatedBy: .equal, toItem: self, attribute: .top, multiplier: 1, constant: 0).isActive = true 
     NSLayoutConstraint(item: blueView, attribute: .top, relatedBy: .equal, toItem: greenView, attribute: .bottom, multiplier: 1, constant: 0).isActive = true 

     NSLayoutConstraint(item: self, attribute: .left, relatedBy: .equal, toItem: superview, attribute: .left, multiplier: 1, constant: 0).isActive = true 
     NSLayoutConstraint(item: self, attribute: .right, relatedBy: .equal, toItem: superview, attribute: .right, multiplier: 1, constant: 0).isActive = true 
     NSLayoutConstraint(item: self, attribute: .centerY, relatedBy: .equal, toItem: superview, attribute: .centerY, multiplier: 1, constant: 0).isActive = true 
     NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 200).isActive = true 
    } 

} 

class GreenView: UIView { 

    init() { 
     super.init(frame: CGRect.zero) 

     translatesAutoresizingMaskIntoConstraints = false 
     backgroundColor = UIColor.green() 
    } 

    override func updateConstraints() { 
     super.updateConstraints() 

     NSLayoutConstraint(item: self, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 300).isActive = true 
     NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 100).isActive = true 
     NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: superview, attribute: .centerX, multiplier: 1, constant: 0).isActive = true 
    } 

} 

class BlueView: UIView { 

    init() { 
     super.init(frame: CGRect.zero) 

     translatesAutoresizingMaskIntoConstraints = false 
     backgroundColor = UIColor.blue() 
    } 

    override func updateConstraints() { 
     super.updateConstraints() 

     NSLayoutConstraint(item: self, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 300).isActive = true 
     NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 100).isActive = true 
     NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: superview, attribute: .centerX, multiplier: 1, constant: 0).isActive = true 
    } 

} 

Answer 1

你需要引腳藍景的底部redView的底部，只是加入這一行redView的updateConstraints：

NSLayoutConstraint(item: blueView, attribute: .bottom, relatedBy: .equal, toItem: self, attribute: .bottom, multiplier: 1, constant: 0).active = true