iOS开发之使用xib自定义View的步骤

2019独角兽企业重金招聘Python工程师标准>>>

1、首先创建一个view对象文件继承自UIView

2、再创建一个xib文件，命名和自定义view相同（其实Xcode创建view文件的时候就有一个选项提示：Also create XIB file，我猜想是创建View文件时同时创建同名的xib文件，但是现在是无法勾选的，我还不知道原因，所以现在只能单独创建），注意要选择User Interface里面的View

这样就得到了三个同名的文件（我就以Book为例）

3、修改xib文件中的类名，因为我们原先创建的xib文件是UIView类型，但是要把它改成我自定义的view类型

把UIView改成我刚刚创建的自定义View名：XXBookView

4、把xib的加载过程封装到自定义view的构造方法中，还要给自定义view增加一个XXBook的模型属性，用来设置数据。

模型XXbook：

//
//  XXBook.h
//  CustomViewWithXib
//
//  Created by Daniel on 16/3/3.
//  Copyright © 2016年 Daniel. All rights reserved.
//

#import <Foundation/Foundation.h>

@interface XXBook : NSObject

/** 图书封面 */
@property(nonatomic, strong) NSString *bookImage;

/** 图书作者 */
@property(nonatomic, strong) NSString *bookAuthor;

/** 图书价格 */
@property(nonatomic, strong) NSString *bookPrice;

@end

自定义View：

//
//  XXBookView.h
//  CustomViewWithXib
//
//  Created by Daniel on 16/3/3.
//  Copyright © 2016年 Daniel. All rights reserved.
//

#import <UIKit/UIKit.h>
@class  XXBook;

@interface XXBookView : UIView

/** 图书模型属性 */
@property(nonatomic, strong) XXBook *book;

+ (instancetype)bookView;

+ (instancetype)bookViewWithBook:(XXBook *)book;


@end

//
//  XXBookView.m
//  CustomViewWithXib
//
//  Created by Daniel on 16/3/3.
//  Copyright © 2016年 Daniel. All rights reserved.
//

#import "XXBookView.h"
#import "XXBook.h"

@implementation XXBookView

+ (instancetype)bookView {
    
    return [self bookViewWithBook:nil];
    
}

+ (instancetype)bookViewWithBook:(XXBook *)book {
    
    //这里用同名xib的好处就体现了，用NSStringFromClass方法获得的类名也就是xib文件名，不用手动输，避免写错
    XXBookView *bookView = [[[NSBundle mainBundle]loadNibNamed:NSStringFromClass(self) owner:nil options:nil] firstObject];
    
    bookView.book = book;
    return bookView;
    
}


@end

5、在类扩展中增加子控件属性，关联xib中的子控件

//
//  XXBookView.m
//  CustomViewWithXib
//
//  Created by Daniel on 16/3/3.
//  Copyright © 2016年 Daniel. All rights reserved.
//

#import "XXBookView.h"
#import "XXBook.h"

/** 类扩展中增加子控件属性，关联xib中的子控件 */
@interface XXBookView()

@property (weak, nonatomic) IBOutlet UIImageView *bookView;

@property (weak, nonatomic) IBOutlet UILabel *authorLable;

@property (weak, nonatomic) IBOutlet UILabel *priceLable;

@end

@implementation XXBookView

+ (instancetype)bookView {
    
    return [self bookViewWithBook:nil];
    
}

+ (instancetype)bookViewWithBook:(XXBook *)book {
    
    //这里用同名xib的好处就体现了，用NSStringFromClass方法获得的类名也就是xib文件名，不用手动输，避免写错
    XXBookView *bookView = [[[NSBundle mainBundle]loadNibNamed:NSStringFromClass(self) owner:nil options:nil] firstObject];
    
    bookView.book = book;
    return bookView;
    
}


@end

6、模型属性的setter方法中将数据设置到子控件上去。

//
//  XXBookView.m
//  CustomViewWithXib
//
//  Created by Daniel on 16/3/3.
//  Copyright © 2016年 Daniel. All rights reserved.
//

#import "XXBookView.h"
#import "XXBook.h"

/** 类扩展中增加子控件属性，关联xib中的子控件 */
@interface XXBookView()

@property (weak, nonatomic) IBOutlet UIImageView *bookImage;

@property (weak, nonatomic) IBOutlet UILabel *authorLable;

@property (weak, nonatomic) IBOutlet UILabel *priceLable;

@end

@implementation XXBookView

+ (instancetype)bookView {
    
    return [self bookViewWithBook:nil];
    
}

+ (instancetype)bookViewWithBook:(XXBook *)book {
    
    //这里用同名xib的好处就体现了，用NSStringFromClass方法获得的类名也就是xib文件名，不用手动输，避免写错
    XXBookView *bookView = [[[NSBundle mainBundle]loadNibNamed:NSStringFromClass(self) owner:nil options:nil] firstObject];
    
    bookView.book = book;
    return bookView;
    
}

//setter方法:将数据设置到子控件上去
- (void)setBook:(XXBook *)book {
    
    _book = book;
    
    //设置子控件的数据
    self.bookImage.image = [UIImage imageNamed:book.bookImage];
    self.authorLable.text = book.bookAuthor;
    self.priceLable.text = book.bookPrice;
    
}


@end

当然，数据在模型的自定义构造方法中加载就行了，在ViewController中添加这个自定义view就行了

[self.view addSubview:[XXBookView bookView]];

运行的效果图：

我没有在模型中加载数据，所以看到view只有我手动改的背景色和文字。

转载于:https://my.oschina.net/shenhuniurou/blog/630634