黑马程序员_iOS 的基础控件之xib

iOS，Android，Java培训，期待与您的交流
iOS应用开发的一项内容就是用户界面的开发。不管应用程序实际包含的逻辑有多复杂，如果这个应用程序没有提供友好的图形用户界面，將很难吸引用户。作为一个程序设计者，必须优先考虑用户的感受，一定要让用户感到爽，这个应用程序才有价值。
xib是早期iOS开发的界面设计文件，从iOS5开始，Xcode使用比xib更近一步的StoryBoard来设计UI界面。但是xib并没有被淘汰，在iOS开发中，某些界面的开发必须用到xib。总体而言，storyboard和xib的用法遵循如下规则：
storyboard，描述软件界面，大范围，重量级，比较适合整个软件的所有界面
xib：描述软件界面，小范围，轻量级，适合描述小界面
1    xib的基本使用
xib的使用与StroyBoard大同小异，一样需要拖控件到界面。但需要特别注意的时，xib文件有一个file owner选项。该file owner一般是一个类，xib中控件的事件监听方法必须是该file owner的方法，即如果没有指定file owner是没法用连线指定控件的监听方法(可以用addTarget方法)。用代码加载xib文件时，也要指定一个file owner对象。两个file onwer的意义不同，前者是为了绑定监听方法，后者是运行时，系统才会真正调用在代码中指定的file owner的监听方法。下面是一个xib的界面，只包含一个按钮，指定该xib的file owner是一个Dog类，监听方法是- (IBAction)btnClick;

用代码加载xib时，可以指定file owner为Dog实例，也可以不指定。如果不指定，单击按钮时，将会调用nil的btnClick;方法，会导致EXC_BAD_ACCESS错误。也不能指定局部变量，因为局部变量在它所在的方法结束后，该局部变量就不存在了，也会导致EXC_BAD_ACCESS错误

  - (void)viewDidLoad{    [super viewDidLoad];    _d1 = [[Dog alloc] init]; //成员变量     _d1.age = 10;        _d2 = [[Dog alloc] init];  //成员变量    _d2.age = 20;       Dog *d = [[Dog alloc] init];  //局部变量    //加载xib文件，xib的file owner不能是局部变量。file owner也能为空，但会导致EXC_BAD_ACCESS错误    UIView *blueView = [[NSBundle mainBundle] loadNibNamed:@"MyView" owner:_d2 options:nil][0];    //UIView *blueView = [[NSBundle mainBundle] loadNibNamed:@"MyView" owner:nil options:nil][0];         blueView.center = CGPointMake(160, 200);    [self.view addSubview:blueView];}

2    xib的重用
给xib指定file owner，降低了程序的耦合性。而且在程序中硬编码，加载xib文件，也不是一个好的编程方式。可以將xib抽象成一个类，调用该类的某个方法创建xib。以下面的xib界面为例，说明如何重用xib。

该界面的左边是一个图片按钮，中间是UILabel，右边是删除按钮。只要指定图片按钮的图片，和UILabel的现实文本，就能得到该xib代表的界面。

  //RowView.h@interface RowView : UIView//类方法，用于创建xib界面+ (id)rowViewWithIcon:(NSString *)icon name:(NSString *)name;@property (nonatomic, weak) IBOutlet UIButton *iconBtn; //图片按钮@property (nonatomic, weak) IBOutlet UILabel *nameLabel;  //联系人姓名@end//RowView.m@implementation RowView+ (id)rowViewWithIcon:(NSString *)icon name:(NSString *)name{    RowView *view = [[NSBundle mainBundle] loadNibNamed:@"RowView" owner:nil options:nil][0];        // 1.设置图标//    UIButton *iconBtn = (UIButton *)[view viewWithTag:1];    [view.iconBtn setImage:[UIImage imageNamed:icon] forState:UIControlStateNormal];        // 2.设置姓名//    UILabel *nameLabel = (UILabel *)[view viewWithTag:2];    view.nameLabel.text = name;        return view;}@end

3    联系人管理
用一个联系人管理的实例，说明如何应用xib和StoryBoard开发应用程序。联系人管理的界面如下图所示。

上图的UIToolBar是固定的，可以用StroyBoard创建，红色的联系人信息是不断变化，用xib创建。该xib对应的类已经在上文给出。当点击添加按钮时，增加一条联系人信息，通过监听事件方法实现。

  #pragma mark 添加一行- (IBAction)add:(UIBarButtonItem *)sender {    // 0.取出最后一个子控件    UIView *last = [self.view.subviews lastObject];    // 这行的Y = 最后一个子控件的Y + 最后一个子控件的高度 + 间距    CGFloat rowY = last.frame.origin.y + last.frame.size.height + 1;        // 1.创建一行    UIView *rowView = [self createRowView];        // 2.添加一行到控制器的view中    [self.view addSubview:rowView];        // 3.让删除item有效    _removeItem.enabled = YES;        // 4.执行动画    rowView.frame = CGRectMake(320, rowY, 320, kRowH);    rowView.alpha = 0;        // 4.1.开始动画    [UIView animateWithDuration:kDuration animations:^{        rowView.frame = CGRectMake(0, rowY, 320, kRowH);        rowView.alpha = 1;    }];}#pragma mark 创建一行(从xib中加载一行的view)// xib == nib- (UIView *)createRowView{    NSString *icon = [NSString stringWithFormat:@"01%d.png", arc4random_uniform(9)];    NSString *name = _allNames[arc4random_uniform(_allNames.count)];        RowView *rowView = [RowView rowViewWithIcon:icon name:name];        return rowView;}

点击UIToolBar的删除按钮，删除最后一个联系人，监听事件方法如下。

  #pragma mark 删除一行- (IBAction)remove:(UIBarButtonItem *)sender {    // 1.取出最后一个子控件    UIView *last = [self.view.subviews lastObject];        [UIView animateWithDuration:kDuration animations:^{        CGRect tempF = last.frame;        tempF.origin.x = 320;        last.frame = tempF;                last.alpha = 0;    } completion:^(BOOL finished) {        [last removeFromSuperview];                // 剩下的子控件个数 > 1就能够点击“删除”        _removeItem.enabled = self.view.subviews.count > 1;    }];}

点击联系人信息的删除按钮，删除该行，后面的行自动向上填充。

  #pragma mark 监听删除按钮点击- (void)deleteClick:(UIButton *)btn{    [UIView animateWithDuration:kDuration animations:^{        CGRect tempF = btn.superview.frame;        tempF.origin.x = 320;        btn.superview.frame = tempF;                btn.superview.alpha = 0;    } completion:^(BOOL finished) {        // 1.获得即将删除的这行在数组中的位置        int startIndex = [self.view.subviews indexOfObject:btn.superview];                // 2.删除当前行        [btn.superview removeFromSuperview];                [UIView animateWithDuration:0.3 animations:^{            // 3.遍历后面的子控件            for (int i = startIndex; i 1;    }];}

iOS，Android，Java培训，期待与您的交流