这里使用纯代码的方式来自定义等高cell,使用Autolayout方式: 有autolayout代码,VFL,masonry等实现方式
这三种方式,最重要的也是使用第三方框架Masonry来实现Autolayout.所以我们就使用这种方式来做
需要用到的第三方框架: MJExtension,Masonry
实现思路及简要过程:
其实过程和我上一篇UI 一一 自定义等高cell (纯代码-Frame)方式的思路一模一样.
不同之处就在于: 设置子控件的位置.的方法发生了变化,其他代码几乎一样
1 .新建一个继承自
UITableViewCell的子类，比如ZYTgCell
@interface ZYTgCell : UITableViewCell
@end- 重写
-initWithStyle:reuseIdentifier:方法- 在这个方法中添加所有的子控件
- 给子控件做一些初始化设置（设置字体、文字颜色等）
/**
* 在这个方法中添加所有的子控件
*/
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
// ......
}
return self;
}- 重写
-layoutSubviews方法- 一定要调用
[super layoutSubviews] - 在这个方法中计算和设置所有子控件的frame
- 一定要调用
/**
* 在这个方法中计算所有子控件的frame
*/
- (void)layoutSubviews
{
[super layoutSubviews];
// ......
}@class ZYTg;
@interface ZYTgCell : UITableViewCell
/** 团购模型数据 */
@property (nonatomic, strong) ZYTg *tg;
@end- 在set方法中给子控件设置模型数据
- (void)setTg:(ZYTg *)tg
{
_tg = tg;
// .......
}- 注册cell的类型
[self.tableView registerClass:[ZYTgCell class] forCellReuseIdentifier:ID];
- 给cell传递模型数据
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
// 访问缓存池
ZYTgCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
// 设置数据(传递模型数据)
cell.tg = self.tgs[indexPath.row];
return cell;
}
具体代码实现:
ZYTg文件
#import
@interface ZYTg : NSObject
/** 图标 */
@property (nonatomic, copy) NSString *icon;
/** 标题 */
@property (nonatomic, copy) NSString *title;
/** 价格 */
@property (nonatomic, copy) NSString *price;
/** 购买数 */
@property (nonatomic, copy) NSString *buyCount;
+ (instancetype)tgWithDict :(NSDictionary *)dict;
@end
@implementation ZYTg
+ (instancetype)tgWithDict:(NSDictionary *)dict
{
ZYTg *tg = [[self alloc] init];
// 属性和plist中的数据一一对应的时候,可以使用KVC的方法
[tg setValuesForKeysWithDictionary:dict];
return tg;
}
@endZYTgCell文件
#import
@class ZYTg;
@interface ZYTgCell : UITableViewCell
/** 团购模型 */
@property(nonatomic, strong)ZYTg * tg;
@end
#import "ZYTg.h"
// 这个两个宏必须写在Masonry.h的前面
// 方法名和参数的前缀mas可以不写
#define MAS_SHORTHAND
// 可以不写mas_equalTo的前缀mas
#define MAS_SHORTHAND_GLOBALS
#import "Masonry.h"
@interface ZYTgCell ()
/** 图标 */
@property (nonatomic, weak) UIImageView *iconImageView;
/** 标题 */
@property (nonatomic, weak) UILabel *titleLabel;
/** 价格 */
@property (nonatomic, weak) UILabel *priceLabel;
/** 购买数 */
@property (nonatomic, weak) UILabel *buyCountLabel;
@end
@implementation ZYTgCell
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
// 添加子控件
/** 图标 */
CGFloat space = 10;
UIImageView *iconImageView = [[UIImageView alloc] init];
[self.contentView addSubview:iconImageView];
self.iconImageView = iconImageView;
[iconImageView makeConstraints:^(MASConstraintMaker *make) {
// make.left.equalTo(self.contentView.left).offset(space);
// make.top.equalTo(self.contentView.top).offset(space);
make.left.and.top.equalTo(self.contentView).offset(space);
make.bottom.equalTo(self.contentView).offset(-space);
make.width.equalTo(80);
}];
/** 标题 */
UILabel *titleLabel = [[UILabel alloc] init];
[self.contentView addSubview:titleLabel];
self.titleLabel = titleLabel;
[titleLabel makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(iconImageView.top);
make.left.equalTo(iconImageView.right).offset(space);
make.right.equalTo(self.contentView.right).offset(-space);
make.height.equalTo(20);
}];
/** 价格 */
UILabel *priceLabel = [[UILabel alloc] init];
priceLabel.font = [UIFont systemFontOfSize:15];
priceLabel.textColor = [UIColor orangeColor];
[self.contentView addSubview:priceLabel];
self.priceLabel = priceLabel;
[priceLabel makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(titleLabel.left);
make.bottom.equalTo(self.contentView.bottom).offset(-space);
make.size.equalTo(CGSizeMake(100, 15));
}];
/** 购买数 */
UILabel *buyCountLabel = [[UILabel alloc] init];
buyCountLabel.textAlignment = NSTextAlignmentRight;
buyCountLabel.textColor = [UIColor lightGrayColor];
buyCountLabel.font = [UIFont systemFontOfSize:14];
[self.contentView addSubview:buyCountLabel];
self.buyCountLabel = buyCountLabel;
[buyCountLabel makeConstraints:^(MASConstraintMaker *make) {
make.bottom.equalTo(iconImageView.bottom);
make.right.equalTo(titleLabel.right);
make.size.equalTo(CGSizeMake(150, 14));
}];
}
return self;
}
// 设置所有的子控件的frame
//- (void)layoutSubviews
//{
// [super layoutSubviews];
//
//}
/**
设置子控件的数据
*/
- (void)setTg:(ZYTg *)tg
{
_tg = tg;
self.iconImageView.image = [UIImage imageNamed:tg.icon];
self.titleLabel.text = tg.title;
self.priceLabel.text = [NSString stringWithFormat:@"¥%@",tg.price];
self.buyCountLabel.text = [NSString stringWithFormat:@"%@人已购买",tg.buyCount];
}
@endViewController 文件
#import "ViewController.h"
#import "ZYTgCell.h"
#import "ZYTg.h"
#import "MJExtension.h"
@interface ViewController ()
@property (nonatomic,strong)NSArray *tgs;
@end
@implementation ViewController
- (NSArray *)tgs
{
if (!_tgs) {
// NSArray *dictArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"tgs.plist" ofType:nil]];
// NSMutableArray *temp = [NSMutableArray array];
// for (NSDictionary *tgDict in dictArray) {
// [temp addObject:[ZYTg tgWithDict:tgDict]];
// }
// 当数据从网络上加载的时候使用这个方法
// _tgs = [ZYTg mj_objectArrayWithKeyValuesArray:dictArray];
// _tgs = [ZYTg mj_objectArrayWithFile:[[NSBundle mainBundle] pathForResource:@"tgs.plist" ofType:nil]];
// 使用plist加载
_tgs = [ZYTg mj_objectArrayWithFilename:@"tgs.plist"];
}
return _tgs;
}
- (void)viewDidLoad {
[super viewDidLoad];
self.tableView.rowHeight = 70;
}
#pragma -mark 数据源方法
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return self.tgs.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *ID = @"tg";
ZYTgCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
if (cell == nil) {
cell = [[ZYTgCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
}
// 设置数据(传递模型)
cell.tg = self.tgs[indexPath.row];
return cell;
}
@end
