iOS边练边学--自定义等高的cell

一、storyboard自定义cell

<1>创建一个继承自UITableViewCell的子类，比如ChaosDealCell

<2>在storyboard中

　　<2.1>往cell里面增加需要用到的子控件

　　<2.2>设置cell的重用标识

　　<2.3>设置cell的class为ChaosDealCell

<3>在控制器中

　　<3.1>利用重用标识找到cell并且给cell传递模型数据

<4>在ChaosDealCell中

　　<4.1>将storyboard中的子控件连线到类扩展中

　　<4.2>需要提供一个模型属性，重写模型的set方法，在这个方法中设置模型数据到子控件上

二、Xib自定义cell

<1>创建一个继承自UITableViewCell的子类，比如ChaosDealCell

<2>创建一个xib文件（文件名建议跟cell的类名一样），比如ChaosDealCell.xib

　　<2.1>拖拽一个UITableViewCell出来

　　<2.2>修改cell的class为ChaosDealCell，，设置cell的重用标识

　　<2.3>往cell中添加需要用到的子控件

<3>在控制器中，别忘了给cell传递模型数数据

　　<方法一：>利用registerNib...方法注册xib文件

 1 - (void)viewDidLoad {
 2     [super viewDidLoad];
 3     
 4 //    [self.tableView registerNib:[UINib nibWithNibName:NSStringFromClass([ChaosDealCell class]) bundle:nil] forCellReuseIdentifier:@"deal"];
 5     // 分成两步写
 6     // 1.加载Nib
 7     UINib *nib = [UINib nibWithNibName:NSStringFromClass([ChaosDealCell class]) bundle:[NSBundle mainBundle]];
 8     // 注册cell
 9     [self.tableView registerNib:nib forCellReuseIdentifier:@"deal"];
10 }

　　<方法二：>利用重用标识找到cell（如果没有注册xib文件，就需要手动加载xib文件）

 1 // 告诉tableView返回什么样的cell
 2 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
 3 {
 4     // 获取对应行的数据
 5 //    ChaosDeals *deal = self.deals[indexPath.row];
 6     
 7     // 根据tableView从缓存池中拿cell
 8     ChaosDealCell *cell = [tableView dequeueReusableCellWithIdentifier:@"deal"];
 9     if (cell == nil) {
10         cell = [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass([ChaosDealCell class]) owner:nil options:nil] lastObject];
11     }
12     cell.deal = self.deals[indexPath.row];
13     return cell;
14 }

<4>在ChaosDealCell中

　　<4.1>将xib中的子控件连线到类扩展中

　　<4.2>需要提供一个模型属性，重写模型的set方法，在这个方法中设置模型数据到子控件上

　　<4.3>也可以将创建获得cell的代码封装起来（比如cellWithTableView:方法）

1 + (instancetype)cellWithTableView:(UITableView *)tableView
2 {
3     ChaosDealCell *cell = [tableView dequeueReusableCellWithIdentifier:@"deal"];
4     if (cell == nil) {
5         cell = [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass([ChaosDealCell class]) owner:nil options:nil] lastObject];
6     }
7     return cell;
8 }

三、代码自定义cell（使用frame）

<1>创建一个集成自UITableViewCell的子类，比如ChaosDealCell

　　<1.1>在initWithStyle:reuseIdentifier:方法中

　　*添加子控件

　　*设置子空间的初始化属性（比如文字颜色、字体）

　　<1.2>在layoutSubviews方法中设置子控件的frame

　　<1.3>需要提供一个模型属性，重写模型的set方法，在这个方法中设置模型数据到子控件

<2>在控制器中

　　<2.1>利用registerClass...方法注册ChaosDealCell类

　　<2.2>利用重用标识找到cell（如果没有注册类，就需要手动创建cell）

　　<2.3>给cell传递模型数据

　　<2.4>也可以将创建获得cell的代码封装起来（比如cellWithTableView:方法）

  1 #import "XMGDealCell.h"
  2 #import "XMGDeal.h"
  3 
  4 @interface XMGDealCell()
  5 @property (weak, nonatomic) UIImageView *iconView;
  6 @property (weak, nonatomic) UILabel *titleLabel;
  7 @property (weak, nonatomic) UILabel *priceLabel;
  8 @property (weak, nonatomic) UILabel *buyCountLabel;
  9 @end
 10 
 11 @implementation XMGDealCell
 12 
 13 + (instancetype)cellWithTableView:(UITableView *)tableView
 14 {
 15     static NSString *ID = @"deal";
 16     // 创建cell
 17     XMGDealCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
 18 //    if (cell == nil) {
 19 //        cell = [[XMGDealCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
 20 //    }
 21     return cell;
 22 }
 23 
 24 // 1.在initWithStyle:reuseIdentifier:方法中添加子控件
 25 
 26 - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
 27 {
 28     if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
 29         UIImageView *iconView = [[UIImageView alloc] init];
 30         [self.contentView addSubview:iconView];
 31         self.iconView = iconView;
 32         
 33         UILabel *titleLabel = [[UILabel alloc] init];
 34         [self.contentView addSubview:titleLabel];
 35         self.titleLabel = titleLabel;
 36         
 37         UILabel *priceLabel = [[UILabel alloc] init];
 38         priceLabel.textColor = [UIColor orangeColor];
 39         [self.contentView addSubview:priceLabel];
 40         self.priceLabel = priceLabel;
 41         
 42         UILabel *buyCountLabel = [[UILabel alloc] init];
 43         buyCountLabel.textAlignment = NSTextAlignmentRight;
 44         buyCountLabel.font = [UIFont systemFontOfSize:14];
 45         buyCountLabel.textColor = [UIColor lightGrayColor];
 46         [self.contentView addSubview:buyCountLabel];
 47         self.buyCountLabel = buyCountLabel;
 48     }
 49     return self;
 50 }
 51 
 52 // 2.在layoutSubviews方法中设置子控件的frame
 53 - (void)layoutSubviews
 54 {
 55     [super layoutSubviews];
 56     
 57     CGFloat contentH = self.contentView.frame.size.height;
 58     CGFloat contentW = self.contentView.frame.size.width;
 59     CGFloat margin = 10;
 60     
 61     CGFloat iconX = margin;
 62     CGFloat iconY = margin;
 63     CGFloat iconW = 100;
 64     CGFloat iconH = contentH - 2 * iconY;
 65     self.iconView.frame = CGRectMake(iconX, iconY, iconW, iconH);
 66     
 67     // titleLabel
 68     CGFloat titleX = CGRectGetMaxX(self.iconView.frame) + margin;
 69     CGFloat titleY = iconY;
 70     CGFloat titleW = contentW - titleX - margin;
 71     CGFloat titleH = 21;
 72     self.titleLabel.frame = CGRectMake(titleX, titleY, titleW, titleH);
 73 //    CGRectMake(titleX, titleY, titleW, titleH);
 74     
 75     // priceLabel
 76     CGFloat priceX = titleX;
 77     CGFloat priceH = 21;
 78     CGFloat priceY = contentH - margin - priceH;
 79     CGFloat priceW = 70;
 80     self.priceLabel.frame = CGRectMake(priceX, priceY, priceW, priceH);
 81     
 82     // buyCountLabel
 83     CGFloat buyCountH = priceH;
 84     CGFloat buyCountY = priceY;
 85     CGFloat buyCountX = CGRectGetMaxX(self.priceLabel.frame) + margin;
 86     CGFloat buyCountW = contentW - buyCountX - margin;
 87     self.buyCountLabel.frame = CGRectMake(buyCountX, buyCountY, buyCountW, buyCountH);
 88 }
 89 
 90 // 3.重写模型的set方法
 91 - (void)setDeal:(XMGDeal *)deal
 92 {
 93     _deal = deal;
 94     
 95     // 设置数据
 96     self.iconView.image = [UIImage imageNamed:deal.icon];
 97     self.titleLabel.text = deal.title;
 98     self.priceLabel.text = [NSString stringWithFormat:@"￥%@", deal.price];
 99     self.buyCountLabel.text = [NSString stringWithFormat:@"%@人已购买", deal.buyCount];
100 }
101 
102 @end

View Code

四、代码自定义cell（使用autolayout）