@IBDesignable视图不会在Interface Builder中绘制背景颜色

Question

我很好奇为什么不将backgroundColor设置为红色？

@IBDesignable class CustomLabel: UIView {

  let view = UIView()

  func setup() {
    backgroundColor = UIColor.red
    view.backgroundColor = UIColor.green
    view.frame = CGRect(x: 0, y: 0, width: 50, height: 50)
    addSubview(view)
  }

  override init(frame: CGRect) {
    super.init(frame: frame)
    setup()
  }
  required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    setup()
  }
}

结果就是这样。

这就是我期望的样子。

Answer 1

在“界面”构建器（IB）中进行渲染时，在调用init之后会加载在自定义UI元素的IB中设置的属性。您在backgroundColor中设置init的代码即被调用。但之后，它再次为IB中的backgroundColor值设置backgroundColor。

我找不到Apple的文档。我基于以下分析说这个。我稍微修改了你的代码以便进行调试。

@IBDesignable class CustomLabel: UIView {

    let view = UIView()

    override var backgroundColor: UIColor? {
        didSet {
            print("here: "); // break point 1
        }
    }

    func setup() {
        self.backgroundColor = UIColor.redColor()  // break point 2
        view.backgroundColor = UIColor.greenColor()
        view.frame = CGRect(x: 0, y: 0, width: 50, height: 50)
        addSubview(view)
    }

    override init(frame: CGRect) {
        super.init(frame: frame)  // break point 3
        setup()
    }
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)  // break point 4
        setup()
    }
}

现在，将断点放在所有方法中。然后，在Interface Builder中选择CustomLabel的对象，然后选择编辑器➔调试所选视图。

您可以看到方法调用的顺序。这只显示了界面构建器中的渲染顺序，而不是它在运行时可能遵循的顺序。

您可能知道这一点，但为了清楚起见，您可以使用以下内容在IB中反映这一点。

override func prepareForInterfaceBuilder() {
    super.prepareForInterfaceBuilder()
    backgroundColor = UIColor.grayColor()

}