NSLayoutConstraint 在操场上答案

【问题标题】：NSLayoutConstraint in playgroundNSLayoutConstraint 在操场上
【发布时间】：2021-06-30 17:09:59
【问题描述】：

我正在尝试重现这样的场景，其中红色和蓝色矩形可以针对不同的屏幕尺寸占据相同的宽度和高度（以及它们之间的相同间隙）。

我正在使用 NSLayoutConstraint（我知道现在首选锚点，只是尝试探索基础知识）。我在 swift playground 中尝试了以下代码：

import Foundation
import UIKit
import PlaygroundSupport

class MyViewController : UIViewController {
    var firstColorView:  UIView!
    var secondColorView: UIView!

    override func viewWillAppear(_ animated: Bool) {
        var myView: UIView!
        myView = view
        myView.backgroundColor = .white

        firstColorView = UIView()
        secondColorView = UIView()
        firstColorView.backgroundColor = .red
        secondColorView.backgroundColor = .blue

        myView.addSubview(firstColorView)
        myView.addSubview(secondColorView)


        //myView.translatesAutoresizingMaskIntoConstraints = false
        //view.addSubview(myView)

        //  horizontal constraints
        let left_constraint = NSLayoutConstraint(item: firstColorView, attribute: .leftMargin, relatedBy: .equal, toItem: myView, attribute: .left, multiplier: 1.0, constant: 20)
        let middle_constraint = NSLayoutConstraint(item: secondColorView, attribute: .leftMargin, relatedBy: .equal, toItem: firstColorView, attribute: .right, multiplier: 1.0, constant: 10)
        let right_constraint = NSLayoutConstraint(item: myView, attribute: .rightMargin, relatedBy: .equal, toItem: secondColorView, attribute: .right, multiplier: 1.0, constant: 20)
        let width_constraint = NSLayoutConstraint(item: firstColorView, attribute: .width, relatedBy: .equal, toItem: secondColorView, attribute: .width, multiplier: 1.0, constant: 0)

        // vertical constraints
        let top_constraint1 = NSLayoutConstraint(item: firstColorView, attribute: .top, relatedBy: .equal, toItem: myView, attribute: .top, multiplier: 1.0, constant: 10)
        let top_constraint2 = NSLayoutConstraint(item: secondColorView, attribute: .top, relatedBy: .equal, toItem: myView, attribute: .top, multiplier: 1.0, constant: 10)
        let bottom_constraint1 = NSLayoutConstraint(item: myView, attribute: .bottom, relatedBy: .equal, toItem: firstColorView, attribute: .bottom, multiplier: 1.0, constant: 10)
        let bottom_constraint2 = NSLayoutConstraint(item: myView, attribute: .bottom, relatedBy: .equal, toItem: secondColorView, attribute: .bottom, multiplier: 1.0, constant: 0)

        NSLayoutConstraint.activate([left_constraint, middle_constraint, right_constraint, width_constraint, top_constraint1, top_constraint2, bottom_constraint1, bottom_constraint2])
        self.view.layoutIfNeeded()
    }
}


// Present the view controller in the Live View window
PlaygroundPage.current.needsIndefiniteExecution = true
PlaygroundPage.current.liveView = MyViewController()

但它显示的只是一个白色屏幕，其宽度与 iphone 的不匹配。我在这里做错了什么？为什么我看不到红蓝屏？

【问题讨论】：

标签： ios swift iphone autolayout swift-playground

【解决方案1】：

你错过了

firstColorView.translatesAutoresizingMaskIntoConstraints = false  
secondColorView.translatesAutoresizingMaskIntoConstraints = false

【讨论】：

谢谢！我从here 看到，这个属性对于故事板和基于 nib 的视图是正确的，而对于以编程方式创建的视图是错误的。这看起来很奇怪，不是吗。自动布局现在是推荐的解决方案，不知道为什么默认会使用自动调整大小。