本节是第三节的一个延续,建议阅读之前先看一下:XIB使用-Part3 使用XIB自定义视图第三节中使用xib自定义的HeaderView,并且在RootViewController的viewDidLoad方法中创建了HeaderView的对象展示在页面上。这一节将进一步介绍,不用代码创建HeaderView的对象,而是在RootViewController.xib文件中直接使用拖拽的方式创建HeaderView的对象。
本节demo地址:https://github.com/huibaoer/Demo_xib
1.首先在第三节的基础上,将RootViewController的viewDidLoad中的代码做简单修改,将标题设置为“headerView1”,描述设置为“headerView1 from code”,说明headerView1是从代码创建的。
// 1. create headerView1
HeaderView *headerView1 = [[HeaderView alloc] initWithFrame:CGRectMake(0, 100, 320, 100)];
headerView1.titleLabel.text = @"headerView1";
headerView1.descriptionLabel.text = @"headerView1 from code";
[self.view addSubview:headerView1];
运行后效果如下:
2.打开RootViewController.xib文件,拖拽一个View控件到默认的view上,调整控件的大小为320*100,调整位置居中偏下,保证与headerView1不重叠。选中新添加的view,选择右侧第三个选项卡,设置Class为‘HeaderView’,这样保证新添加的view是HeaderView的一个实例。
3.将设置好的headerView连接到RootViewController中,打开xib文件,选择‘Assistant Editor’(Xcode右上方两个圈的按钮),进入助手编辑模式,确保左侧打开的是RootViewController.xib,右侧打开的是RootViewController.m。选中xib中headerView,打开右侧最后一个选项卡(连接选项卡),拖拽New Referencing outlet到RootViewController的延展中生成属性,并命名为‘headerView2’。
4.看起来已经完成,但是运行后会发现headerView2并没有创建成功,在HeaderView的initWithFrame方法中打断点会发现init方法并没有执行。这是因为从xib中创建的实例并不会通过initWithFrame初始化,而是通过另一个初始化方法initWithCoder来初始化。所以实现HeaderView的initWithCoder方法如下:
- (id)initWithCoder:(NSCoder *)aDecoder {
self = [super initWithCoder:aDecoder];
if (self) {
[self setupXib];
}
return self;
}
- (void)setupXib {
[[NSBundle mainBundle] loadNibNamed:@"HeaderView" owner:self options:nil];
[self addSubview:self.contentView];
}
5.在RootViewController的viewDidLoad方法中添加如下代码,设置headerView2的标题和描述。
// 2. config headerView2
self.headerView2.titleLabel.text = @"headerView2";
self.headerView2.descriptionLabel.text = @"headerView2 from XIB";
运行结果如下: