如何使用 Swift 以编程方式添加自定义 UIView 并在 Interface Builder 中查看答案

【问题标题】：How to add a custom UIView programmatically with Swift and see it in Interface Builder如何使用 Swift 以编程方式添加自定义 UIView 并在 Interface Builder 中查看
【发布时间】：2016-01-12 06:00:10
【问题描述】：

我正在尝试使用 Xcode 7 / Swift 2.0 将带有控制器的 UserView 添加到视图中。

我无法弄清楚如何使用 Interface Builder 执行此操作，而是添加了一个 NSView 作为占位符视图，然后在代码中添加该视图。

是否可以使用 Interface Builder 来做到这一点？

在图片中，橙色是占位符，绿色是用户视图：

在代码中添加视图时，我假设我必须添加约束。我尝试使用下面的constraintsWithVisualFormat，但是当我添加它时，视图无法调整大小。我认为这可能与优先级有关。

如何让绿色子视图填充占位符容器并调整大小？

override func windowDidLoad() {
    super.windowDidLoad()
    print("MainWindowController.windowDidLoad");

    let view = UserView01();
    self.m_viewPlaceHolder.addSubview(view.view);

    let hor = NSLayoutConstraint.constraintsWithVisualFormat("H:|-10-[view]-10-|", options: .AlignAllLeft, metrics: nil, views: ["view" : view.view]);
    let ver = NSLayoutConstraint.constraintsWithVisualFormat("V:|-10-[view]-10-|", options: .AlignAllLeft, metrics: nil, views: ["view" : view.view]);
    NSLayoutConstraint.activateConstraints(hor);
    NSLayoutConstraint.activateConstraints(ver);
}

【问题讨论】：

设置view.view的frame等于NSMakeRect(0,0,m_viewPlaceHolder.frame.size.width,m_viewPlaceHolder.frame.size.height)。

标签： cocoa autolayout swift2 xcode7 nslayoutconstraint

【解决方案1】：

首先，无需为您以编程方式创建的视图添加任何占位符。如果您想在故事板中看到它，我建议您将视图类设为@IBDesignable：

@IBDesignable class UserView01: UIView {

    // class declaration

}

您要在编写代码时更改的属性应声明为@IBInspectable，类似于类声明。

为确保执行以编程方式设置的约束，您必须在约束代码之前添加以下行：

view.translatesAutoresizingMaskIntoConstraints = false

它告诉 Xcode 使用您设置的约束而不尝试自动添加任何约束，通常 Xcode 会这样做。除此之外 - 您的代码应该可以正常工作。

还有另一种添加相对约束的方法，您也可以使用：

 let leadingConstraint = NSLayoutConstraint(item: view, attribute: .Leading, relatedBy: .Equal, toItem: placeholder, attribute: .Leading, multiplier: 1, constant: 20)
 let trailingConstraint = NSLayoutConstraint(item: view, attribute: .Trailing, relatedBy: .Equal, toItem: placeholder, attribute: .Trailing, multiplier: 1, constant: 20)
 let topConstraint = NSLayoutConstraint(item: view, attribute: .Top, relatedBy: .Equal, toItem: placeholder, attribute: .Top, multiplier: 1, constant: 20)
 let bottomConstraint = NSLayoutConstraint(item: view, attribute: .Bottom, relatedBy: .Equal, toItem: placeholder, attribute: .Bottom, multiplier: 1, constant: 20)

 view.addConstraints([leadingConstraint, trailingConstraint, topConstraint, bottomConstraint])

只需将view 和placeholder 更改为您在项目中用于视图及其父视图的名称。

【讨论】：