从 Xcode 6 起,Interface Builder(下文简称 IB)中的 View 可以实时渲染了,不需要运行程序就能看到渲染效果,大大提高开发效率。

这里就要提到 IB 中的一个关键字 @IBDesignable(Swift)或 IB_DESIGNABLE(OC)。

下面以 Swift 为例,OC 雷同。

新建一个类 TestView.swift 继承 UIView,在 IB 中拖一个 View 出来,并与其关联,代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
// TestView.swift
import UIKit

@IBDesignable // 此关键字要写在 class 前面
class TestView: UIView {

override func awakeFromNib() {
super.awakeFromNib()
setup()
}

override func prepareForInterfaceBuilder() {
super.prepareForInterfaceBuilder()
setup()
}

func setup() {
backgroundColor = .gray

let textLabel = UILable(frame: bounds)
textLabel.textAlignment = .center
textLabel.textColor = .white
textLabel.text = "实时渲染"
addSubview(textLabel)
}

}

这样,不需运行程序就能看到 view 已经变成了灰色并显示了文字。

需要注意的是 IB 只能对 UIViewNSView 的子类进行实时渲染,awakeFromNib() 这个方法中代码并不会实时渲染,实时渲染的是 prepareForInterfaceBuilder() 这个方法中的代码。prepareForInterfaceBuilder() 这个方法只在有 @IBDesignable 标示的类中起作用,只在 IB 编译时起作用,且需要调用 super。

除了 prepareForInterfaceBuilder() 这个方法中的代码会实时渲染外,还有 init(frame:)draw(_ rect:)layoutSubviews() 中的代码也会实时渲染。