ios - 如何以编程方式布置 Storyboard 上的 View ？

我尝试通过视觉格式语言在故事板上的视图上以编程方式使用自动布局，但失败了。代码如下:
(顺便说一句，显示bView的情节提要并不重要，因此我没有上载情节提要的图片。也没有在情节提要上设置任何约束。)

class ViewController: UIViewController {

    @IBOutlet var bView: UIView!
    override func viewDidLoad() {
        super.viewDidLoad()
        bView.translatesAutoresizingMaskIntoConstraints = false
        var allConstraints = [NSLayoutConstraint]()
        let vC =  NSLayoutConstraint.constraintsWithVisualFormat("V:|-[bView]-|", options: [], metrics: nil, views: ["bView":bView])
        let hC = NSLayoutConstraint.constraintsWithVisualFormat("H:|-[bView]-|", options: [], metrics: nil, views: ["bView":bView])
        allConstraints += vC
        allConstraints += hC
        NSLayoutConstraint.activateConstraints(allConstraints)
    }

    override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
    }
}

但是执行时会显示错误:

***由于未捕获的异常“NSInvalidArgumentException”而终止应用程序，原因:“无法解析约束
格式:无法解释“|”人物，因为相关的观点
没有 super 视图V:|-[bView]-|
^'

我想也许superView(viewController的视图)确实添加到了mainWindow上。因此，我尝试通过将代码移至 viewWillLayoutSubviews()来解决此问题。如下:

class ViewController: UIViewController {

    @IBOutlet var bView: UIView!
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
        bView.translatesAutoresizingMaskIntoConstraints = false
        var allConstraints = [NSLayoutConstraint]()
        let vC =  NSLayoutConstraint.constraintsWithVisualFormat("V:|-[bView]-|", options: [], metrics: nil, views: ["bView":bView])
        let hC = NSLayoutConstraint.constraintsWithVisualFormat("H:|-[bView]-|", options: [], metrics: nil, views: ["bView":bView])
        allConstraints += vC
        allConstraints += hC
        NSLayoutConstraint.activateConstraints(allConstraints)
    }
}

然后，它显示出一个非常有趣的错误结果。



因此，如何以编程方式布置故事板上的视图？

更重要的是，有这样一个有趣的结果:
(它与问题没有直接关系，但是您可以尝试一下来解决问题!)



使用代码:

class ViewController: UIViewController {

    @IBOutlet var bView: UIView!
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
        bView.translatesAutoresizingMaskIntoConstraints = false
    }
}

最佳答案

如果要限制蓝色矩形，则第一个问题是bView插座未正确连接到顶层视图(白色背景)。在连接检查器中删除该连接，然后将蓝色视图连接到bView。

如果在Interface Builder中添加视图，但不给它任何约束，那么Xcode将在构建时添加4个约束。如果单击视图，则会在“大小”检查器中看到以下消息:

所选视图没有约束。在构建时，显式左侧
将为视图生成顶部，宽度和高度约束。

因此，您的视图已经完全指定。如果在代码中添加更多约束，则将产生冲突。

因此，如何为故事板中布置的视图在代码中添加约束？您需要执行以下操作:

在情节提要中为左，顶部，宽度和高度添加显式约束。

在“大小”检查器中编辑这4个约束，然后选中占位符[]在构建时删除旁边的框。

然后，这四个约束将在构建时删除，从而使视图不受约束。现在，您的代码可以自由添加约束。