1、介绍
-
1.1 代码自定义 cell（使用 frame）
- 创建一个继承自 UITableViewCell 的子类，比如 BookCell1。
- 在 initWithStyle:reuseIdentifier: 方法中。
- 添加子控件。
- 设置子控件的初始化属性（比如文字颜色、字体）。
- 在 layoutSubviews 方法中设置子控件的 frame。
- 需要提供一个模型属性，重写模型的 set 方法，在这个方法中设置模型数据到子控件。
- 在控制器中
- 利用 registerClass... 方法注册 BookCell1 类。
- 利用重用标识找到 cell（如果没有注册类，就需要手动创建 cell）。
- 给 cell 传递模型数据。
- 也可以将创建获得 cell 的代码封装起来（比如 cellWithTableView: 方法）。
-
1.2 代码自定义 cell（使用 autolayout）
- 创建一个继承自 UITableViewCell 的子类，比如 BookCell1。
- 在 initWithStyle:reuseIdentifier: 方法中。
- 添加子控件。
- 添加子控件的约束（建议使用 Masonry）。
- 设置子控件的初始化属性（比如文字颜色、字体）。
- 需要提供一个模型属性，重写模型的 set 方法，在这个方法中设置模型数据到子控件。
- 在控制器中
- 利用 registerClass... 方法注册 BookCell1 类。
- 利用重用标识找到 cell（如果没有注册类，就需要手动创建 cell）。
- 给 cell 传递模型数据。
- 也可以将创建获得 cell 的代码封装起来（比如 cellWithTableView: 方法）。
2、代码创建 cell - frame
@class BookModel;
@interface BookCell1 : UITableViewCell
// 定义 Cell 的数据模型
@property (nonatomic, retain)BookModel *book;
@end
#import "BookCell1.h"
#import "BookModel.h"
@interface BookCell1()
// 创建自定义 Cell 视图包含的内容
@property(nonatomic, retain)UIImageView *iconView;
@property(nonatomic, retain)UILabel *titleLabel;
@property(nonatomic, retain)UILabel *detailLabel;
@property(nonatomic, retain)UILabel *priceLabel;
@end
@implementation BookCell1
// 重写初 Cell 始化方法，创建自定义 Cell
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
// 创建子视图
// 创建 iconView 视图，并添加到自定义 Cell 上
self.iconView = [[UIImageView alloc] init];
self.iconView.layer.borderColor = [[UIColor greenColor] CGColor];
self.iconView.layer.borderWidth = 2;
[self.contentView addSubview:self.iconView];
// 创建 titleLabel 视图
self.titleLabel = [[UILabel alloc] init];
self.titleLabel.font = [UIFont boldSystemFontOfSize:14];
self.titleLabel.textColor = [UIColor redColor];
[self.contentView addSubview:self.titleLabel];
// 创建 detailLabel 视图
self.detailLabel = [[UILabel alloc] init];
self.detailLabel.font = [UIFont systemFontOfSize:12];
[self.contentView addSubview:self.detailLabel];
// 创建 priceLabel 视图
self.priceLabel = [[UILabel alloc] init];
self.priceLabel.font = [UIFont systemFontOfSize:12];
[self.contentView addSubview:self.priceLabel];
}
return self;
}
// 布局子视图
- (void)layoutSubviews {
[super layoutSubviews];
// 布局子视图
self.iconView.frame = CGRectMake(10, 10, 60, 60);
self.titleLabel.frame = CGRectMake(90, 5, 200, 25);
self.detailLabel.frame = CGRectMake(90, 30, 200, 25);
self.priceLabel.frame = CGRectMake(90, 55, 200, 25);
}
// 设置显示的数据
- (void)setBook:(BookModel *)book {
_book = book;
// 设置数据，设置 cell 视图上显示的内容 内容
self.iconView.image = [UIImage imageNamed:book.icon];
self.titleLabel.text = book.title;
self.detailLabel.text = book.detail;
self.priceLabel.text = book.price;
}
@end
// 使用自定义 Cell 创建，UITableViewDataSource 协议方法
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
// 使用自定义的 Cell 定义
BookCell1 *cell = [tableView dequeueReusableCellWithIdentifier:@"testIdentifier"];
if (cell == nil) {
// 使用自定义的 Cell 创建
cell = [[BookCell1 alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testIdentifier"];
}
BookModel *bookModel = [self.myDataArray objectAtIndex:indexPath.row];
cell.book = bookModel;
return cell;
}
3、代码注册 cell - frame
- 在 tableView 创建时，从 iOS7 开始多了一种创建 cell 的方式（注册），让 tableView 注册一种 cell，需要设置复用标志。
- 用注册方式创建 cell，如果 tableView 已经注册了某一种 cell，从复用队列里查找，如果找不到，
- 系统会自动通过注册的 cell 类来创建 cell 对象。
3.1 自定义 Cell 部分同上。
- BookCell1.h
- BookCell1.m
3.2 ViewController.m
// 注册 cell
[myTableView registerClass:[BookCell1 class] forCellReuseIdentifier:@"testIdentifier"];
// 使用注册的 Cell 创建，UITableViewDataSource 协议方法
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
BookCell1 *cell = [tableView dequeueReusableCellWithIdentifier:@"testIdentifier" forIndexPath:indexPath];
BookModel *bookModel = [self.myDataArray objectAtIndex:indexPath.row];
cell.book = bookModel;
return cell;
}
4、代码创建 cell - autolayout
@interface XMGDeal : NSObject
@property (strong, nonatomic) NSString *buyCount;
@property (strong, nonatomic) NSString *price;
@property (strong, nonatomic) NSString *title;
@property (strong, nonatomic) NSString *icon;
+ (instancetype)dealWithDict:(NSDictionary *)dict;
@end
@implementation XMGDeal
+ (instancetype)dealWithDict:(NSDictionary *)dict {
XMGDeal *deal = [[self alloc] init];
// KVC - Key Value Coding
[deal setValuesForKeysWithDictionary:dict];
return deal;
}
@end
@class XMGDeal;
@interface XMGDealCell : UITableViewCell
/** 模型数据 */
@property (nonatomic, strong) XMGDeal *deal;
+ (instancetype)cellWithTableView:(UITableView *)tableView;
@end
#define MAS_SHORTHAND
#define MAS_SHORTHAND_GLOBALS
#import "Masonry.h"
@interface XMGDealCell()
@property (weak, nonatomic) UIImageView *iconView;
@property (weak, nonatomic) UILabel *titleLabel;
@property (weak, nonatomic) UILabel *priceLabel;
@property (weak, nonatomic) UILabel *buyCountLabel;
@end
@implementation XMGDealCell
+ (instancetype)cellWithTableView:(UITableView *)tableView {
static NSString *ID = @"deal";
// 创建cell
XMGDealCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
if (cell == nil) {
cell = [[XMGDealCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
}
return cell;
}
// 1.在 initWithStyle:reuseIdentifier: 方法中添加子控件
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
UIImageView *iconView = [[UIImageView alloc] init];
[self.contentView addSubview:iconView];
self.iconView = iconView;
UILabel *titleLabel = [[UILabel alloc] init];
[self.contentView addSubview:titleLabel];
self.titleLabel = titleLabel;
UILabel *priceLabel = [[UILabel alloc] init];
priceLabel.textColor = [UIColor orangeColor];
[self.contentView addSubview:priceLabel];
self.priceLabel = priceLabel;
UILabel *buyCountLabel = [[UILabel alloc] init];
buyCountLabel.textAlignment = NSTextAlignmentRight;
buyCountLabel.font = [UIFont systemFontOfSize:14];
buyCountLabel.textColor = [UIColor lightGrayColor];
[self.contentView addSubview:buyCountLabel];
self.buyCountLabel = buyCountLabel;
}
return self;
}
// 2.在 layoutSubviews 方法中设置子控件的 约束
- (void)layoutSubviews {
[super layoutSubviews];
CGFloat margin = 10;
[self.iconView makeConstraints:^(MASConstraintMaker *make) {
make.width.equalTo(100);
make.left.top.offset(margin);
make.bottom.offset(-margin);
}];
[self.titleLabel makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.iconView);
make.left.equalTo(self.iconView.right).offset(margin);
make.right.offset(-margin);
}];
[self.priceLabel makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.titleLabel);
make.bottom.equalTo(self.iconView);
make.width.equalTo(70);
}];
[self.buyCountLabel makeConstraints:^(MASConstraintMaker *make) {
make.bottom.equalTo(self.priceLabel);
make.right.equalTo(self.titleLabel);
make.left.equalTo(self.priceLabel.right).offset(margin);
}];
}
// 3.重写模型的 set 方法
- (void)setDeal:(XMGDeal *)deal {
_deal = deal;
// 设置数据
self.iconView.image = [UIImage imageNamed:deal.icon];
self.titleLabel.text = deal.title;
self.priceLabel.text = [NSString stringWithFormat:@"￥%@", deal.price];
self.buyCountLabel.text = [NSString stringWithFormat:@"%@人已购买", deal.buyCount];
}
@end
4.5 XMGDealsViewController.m
@interface XMGDealsViewController ()
/** 所有的团购数据 */
@property (nonatomic, strong) NSArray *deals;
@end
@implementation XMGDealsViewController
- (NSArray *)deals {
if (_deals == nil) {
// 加载plist中的字典数组
NSString *path = [[NSBundle mainBundle] pathForResource:@"deals.plist" ofType:nil];
NSArray *dictArray = [NSArray arrayWithContentsOfFile:path];
// 字典数组 -> 模型数组
NSMutableArray *dealArray = [NSMutableArray array];
for (NSDictionary *dict in dictArray) {
XMGDeal *deal = [XMGDeal dealWithDict:dict];
[dealArray addObject:deal];
}
_deals = dealArray;
}
return _deals;
}
- (void)viewDidLoad {
[super viewDidLoad];
// [self.tableView registerClass:[XMGDealCell class] forCellReuseIdentifier:@"deal"];
}
#pragma mark - Table view data source
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return self.deals.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
//创建cell
XMGDealCell *cell = [XMGDealCell cellWithTableView:tableView];
// 取出模型数据
cell.deal = self.deals[indexPath.row];
return cell;
}
@end
