ZXTableView(iOS开发【快速、高效地构建TableView】)

ZXTableView(快速、高效地构建TableView)

github地址

安装

通过CocoaPods安装

pod 'ZXTableView'

手动导入

  • 将ZXTableView拖入项目中。

导入头文件

#import "ZXTableView.h"

创建ZXTableView示例

创建一个最基础的TableView，实现点击删除按钮删除对应行

  • 在TableView所在的控制器中，此处定义的cell对应模型为ZXTestSingleTbModel
//声明cell是什么类
self.tableView.zx_setCellClassAtIndexPath = ^Class (NSIndexPath *  indexPath) {
    return [ZXTestSingleTbCell class];
};
//获取cell对象并对其进行处理
__weak __typeof(self) weakSelf = self;
self.tableView.zx_getCellAtIndexPath = ^(NSIndexPath *indexPath, ZXTestSingleTbCell *cell, id model) {
    cell.delBlock = ^{
        [weakSelf.tableView.zxDatas removeObjectAtIndex:indexPath.row];
        [weakSelf.tableView reloadData];
    };
};
//设置ZXTableView的数据，dataArr即为ZXTestSingleTbModel模型数组，如果需要多个section的效果，只需要改变dataArr即可。
self.tableView.zxDatas = dataArr;
  • 在ZXTestSingleTbCell中
#import "ZXTestSingleTbCell.h"
#import "ZXTestSingleTbModel.h"
@interface ZXTestSingleTbCell()
@property (weak, nonatomic) IBOutlet UIImageView *iconImgV;
@property (weak, nonatomic) IBOutlet UILabel *nameLabel;
@property (weak, nonatomic) IBOutlet UILabel *goodAtLabel;
@property (weak, nonatomic) IBOutlet UIButton *delBtn;
//若cell中有包含model的属性，则会自动将model赋值给它(如果有多个含有model字符串的属性，则赋值给第一个)
@property (strong,nonatomic) ZXTestSingleTbModel *sTbModel;
@end

//重写model的set方法即可
-(void)setSTbModel:(ZXTestSingleTbModel *)sTbModel{
    _sTbModel = sTbModel;
    self.iconImgV.image = sTbModel.iconImg;
    self.nameLabel.text = sTbModel.name;
    self.goodAtLabel.text = sTbModel.goodAt;
}
  • 查看效果
    <img src="http://www.zxlee.cn/ZXTableViewDemoImg/singleDemo.png"/>

创建一个含有HeaderView与FooterView的TableView

  • 在TableView所在的控制器中，此处定义的cell对应模型为ZXTestSingleTbModel
//声明cell是什么类
self.tableView.zx_setCellClassAtIndexPath = ^Class (NSIndexPath *  indexPath) {
    return [ZXTestSingleTbCell class];
};
//声明HeaderView是什么类
self.tableView.zx_setHeaderClassInSection = ^Class(NSInteger section) {
    return [ZXTestHFHeaderView class];
};
//声明FooterView是什么类
self.tableView.zx_setFooterClassInSection = ^Class(NSInteger section) {
    return [ZXTestHFFooterView class];
};
//获取HeaderView对象并对其进行处理
self.tableView.zx_getHeaderViewInSection = ^(NSUInteger section, ZXTestHFHeaderView *headerView, NSMutableArray *secArr) {
    headerView.headerLabel.text = [NSString stringWithFormat:@"HeaderView--%lu",section];
};
//获取FooterView对象并对其进行处理
self.tableView.zx_getFooterViewInSection = ^(NSUInteger section, ZXTestHFFooterView *footerView, NSMutableArray *secArr) {
    footerView.footerLabel.text = [NSString stringWithFormat:@"FooterView--%lu",section];
};
//设置ZXTableView的数据，dataArr即为ZXTestSingleTbModel模型数组，dataArr中包含多个数组。
self.tableView.zxDatas = dataArr;
  • 在ZXTestSingleTbCell中的处理同上
  • 查看效果
    <img src="http://www.zxlee.cn/ZXTableViewDemoImg/secDemo.png"/>

创建动态高度的TableView

  • 在TableView所在的控制器中，此处定义的cell对应模型为ZXTestCHTbModel
#pragma mark 设置TableView
//声明cell是什么类
self.tableView.zx_setCellClassAtIndexPath = ^Class (NSIndexPath *  indexPath) {
    return [ZXTestCHTbCell class];
};
//声明HeaderView是什么类
self.tableView.zx_setHeaderClassInSection = ^Class(NSInteger section) {
    return [ZXTestCHTbSpaceHeader class];
};
//设置ZXTableView的数据，dataArr即为ZXTestCHTbModel模型数组
self.tableView.zxDatas = dataArr;

  • ZXTestCHTbCelll中的处理同上

  • 在ZXTestCHTbModel.h中

@interface ZXTestCHTbModel : NSObject
@property (strong,nonatomic) UIImage *iconImg;
@property (copy,nonatomic) NSString *name;
@property (copy,nonatomic) NSString *time;
@property (copy,nonatomic) NSString *comment;
//此处声明了cellH，则ZXTableView会自动把cell高度赋值给cellH，更改cellH即可改变cell高度
@property (assign,nonatomic) CGFloat cellH;
@end
  • 在ZXTestCHTbModel.m中
#import "ZXTestCHTbModel.h"

@implementation ZXTestCHTbModel
-(void)setComment:(NSString *)comment{
    _comment = comment;
    //此处comment所显示对应的Label距离左右边距离为15，字体大小为14，cell顶部显示个人信息的View高度为50，commentLabel距离上下均为10
    CGFloat commentH = [self getStrHeightWithText:comment font:[UIFont systemFontOfSize:14] viewWidth:[UIScreen mainScreen].bounds.size.width - 15 * 2];
    //将计算的cell高度赋值给cellH即可
    self.cellH = commentH + 10 * 2 + 50;
    
}
//获取文字高度
- (CGFloat)getStrHeightWithText:(NSString *)text font:(UIFont *)font viewWidth:(CGFloat)width {
    NSDictionary *attrs = @{NSFontAttributeName :font};
    CGSize maxSize = CGSizeMake(width, MAXFLOAT);
    NSStringDrawingOptions options = NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading;
    CGSize size = [text boundingRectWithSize:maxSize options:options attributes:attrs context:nil].size;
    return  ceilf(size.height);
}
@end
  • 查看效果
    <img src="http://www.zxlee.cn/ZXTableViewDemoImg/dynamicHDemo.png"/>

具体使用说明

如何快速使用

  • 创建一个tableView的步骤大致分为，声明cell，声明headerView&footerView，self.tableView.zxDatas赋值，在cell中声明一个含有“model”的属性名，重写该属性的set方法即可。
  • ZXTableView中的大多数方法都是zx_开头，zx_set开头代表设置tableView，例如：zx_setCellClass...即为设置(声明)cell的类是谁；zx_get开头代表从tableView中获取信息，例如zx_getCellAt...即为获取cell对象，可依据此结合下方说明快速记忆。

cell相关

声明cell

self.tableView.zx_setCellClassAtIndexPath = ^Class (NSIndexPath *  indexPath) {
    //可以根据indexPath返回不同的cell
    return [MyCell class];
};

获取cell对象，对cell对象进行操作

self.tableView.zx_getCellAtIndexPath = ^(NSIndexPath *indexPath, id cell, id model) {
    //这里的id cell中id可以改成自己当前的cell类名(若只有一种cell)，id model中的id可以改成自己当前模型的类名(若只有一种模型)
}

以上声明cell类与获取cell可以写在同一个方法中

[self.tableView zx_setCellClassAtIndexPath:^Class(NSIndexPath *indexPath) {
    return [MyCell class];
} returnCell:^(NSIndexPath *indexPath, id cell, id model) {
    //获取cell对象
}];

(非必须)设置cell高度

//返回cell高度，ZXTableView默认会将cell高度设置为cell本身高度，也就是xib中cell的高度或纯代码中在初始化方法中设置的cell的高度，若需要改动，则可以使用以下方法实现。
self.tableView.zx_setCellHAtIndexPath = ^CGFloat(NSIndexPath *indexPath) {
    return 70;
};

滑动编辑

self.tableView.zx_editActionsForRowAtIndexPath = ^NSArray<UITableViewRowAction *> *(NSIndexPath *indexPath) {
        UITableViewRowAction *delAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDestructive title:@"删除" handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {
            [weakSelf.tableView.zxDatas removeObjectAtIndex:indexPath.row];
            [weakSelf.tableView reloadData];
        }];
        //第0行不显示侧滑删除，其余行显示侧滑删除，这里只是为了演示控制侧滑删除行的情况
        if(indexPath.row == 0){
            return nil;
        }
        return @[delAction];
    };

设置cell高度的几种方式

  • 在控制器中设置cell高度，可根据indexPath设置不同的cell高度（优先级最高，若设置了，其他高度设置方法均无效）
self.tableView.zx_setCellHAtIndexPath = ^CGFloat(NSIndexPath *indexPath) {
    return 70;
};
  • 在cell中设置cell的高度（优先级最低）
//在cell的初始化方法中设置cell高度即可
self.height = 50;
  • 在model中设置cell的高度（优先级第二，若设置，则在cell中设置cell的高度无效）

在model.h中

//此处声明了cellH，则ZXTableView会自动把cell高度赋值给cellH，更改cellH即可改变cell高度
@property (assign,nonatomic) CGFloat cellH;

在model.m中，在需要的时候更改cellH

//例如，可以重写cellH的set方法，将cell高度在原先基础上增加10
-(void)setCellH:(CGFloat)cellH{
    _cellH = cellH + 10;
}

在cell或model中获取当前的indexPath

  • 在cell中获取当前的indexPath
//在Cell.h或Cell.m中定义属性indexPath即可
@property (strong, nonatomic) NSIndexPath *indexPath;
  • 在model中获取当前的indexPath
//在Model.h或Model.m中定义属性indexPath即可
@property (strong, nonatomic) NSIndexPath *indexPath;

headerView&footerView相关，此处以headerView为例

声明headerView

//声明HeaderView是什么类
self.tableView.zx_setHeaderClassInSection = ^Class(NSInteger section) {
    return [MyHeaderView class];
};

获取headerView对象

//获取HeaderView对象并对其进行处理
self.tableView.zx_getHeaderViewInSection = ^(NSUInteger section, MyHeaderView *headerView, NSMutableArray *secArr) {
    headerView.headerLabel.text = [NSString stringWithFormat:@"HeaderView--%lu",section];
};

以上声明headerView类与获取headerView可以写在同一个方法中

[self.tableView zx_setHeaderClassInSection:^Class(NSInteger) {
    return [MyHeaderView cell];
} returnHeader:^(NSUInteger section, id headerView, NSMutableArray *secArr) {
  //获取headerView对象
}];

(非必须)设置headerView高度

//返回headerViewl高度，ZXTableView默认会将headerView高度设置为headerView本身高度，也就是xib中headerView的高度或纯代码中在初始化方法中设置的headerView的高度，若需要改动，则可以使用以下方法实现。
self.tableView.zx_setHeaderHInSection = ^CGFloat(NSInteger section) {
    return 100;
};

设置headerView&footerView高度的几种方式

  • 在控制器中设置headerView高度
self.tableView.zx_setHeaderHInSection = ^CGFloat(NSInteger section) {
    return 100;
};
  • 在headerView中设置headerView高度
//在headerView的初始化方法中设置headerView高度即可
self.height = 100;

在headerView或footerView中获取当前的section

  • 在headerView中获取当前的section
//在headerView.h或headerView.m中定义属性section即可
@property (strong, nonatomic) NSNumber *section;

headerView&footerView属性相关，此处以headerView为例

  • 无数据是否显示HeaderView，默认为YES
//无数据时不显示headerView
self.tableView.zx_showHeaderWhenNoMsg = NO;
  • 保持headerView不变（仅初始化一次），默认为NO
//保持headerView只初始化一次，之后不再重新创建
self.tableView.zx_keepStaticHeaderView = YES;

tableView代理事件&偏好设置相关

  • 点击了某一行cell
//点击了某一行cell
self.tableView.zx_didSelectedAtIndexPath = ^(NSIndexPath *indexPath, id model, id cell) {
  //这里的id cell中id可以改成自己当前的cell类名(若只有一种cell)，id model中的id可以改成自己当前模型的类名(若只有一种模型)
  
};
  • 取消点击某一行cell
//取消点击某一行cell
self.tableView.zx_didDeSelectedAtIndexPath = ^(NSIndexPath *indexPath, id model, id cell) {
  //这里的id cell中id可以改成自己当前的cell类名(若只有一种cell)，id model中的id可以改成自己当前模型的类名(若只有一种模型)
  
};
  • 禁止系统Cell自动高度 可以有效解决tableView跳动问题，默认为YES
self.tableView.zx_disableAutomaticDimension = YES;
  • 无数据是否显示HeaderView，默认为YES
self.tableView.zx_showHeaderWhenNoMsg = YES;
  • 无数据是否显示FooterView，默认为YES
self.tableView.zx_showFooterWhenNoMsg = YES;
  • 控制获取cell回调在获取model之后，默认为NO
self.tableView.zx_fixCellBlockAfterAutoSetModel = YES;
  • scrollView相关代理
///scrollView滚动事件
@property (nonatomic, copy) void (^zx_scrollViewDidScroll)(UIScrollView *scrollView);
///scrollView缩放事件
@property (nonatomic, copy) void (^zx_scrollViewDidZoom)(UIScrollView *scrollView);
///scrollView滚动到顶部事件
@property (nonatomic, copy) void (^zx_scrollViewDidScrollToTop)(UIScrollView *scrollView);
///scrollView开始拖拽事件
@property (nonatomic, copy) void (^zx_scrollViewWillBeginDragging)(UIScrollView *scrollView);
///scrollView开始拖拽事件
@property (nonatomic, copy) void (^zx_scrollViewDidEndDragging)(UIScrollView *scrollView, BOOL willDecelerate);
  • tableView重写数据源与代理
//tableView的DataSource 设置为当前控制器即可重写对应数据源方法
@property (nonatomic, weak, nullable) id <UITableViewDataSource> zxDataSource;
//tableView的Delegate 设置为当前控制器即可重写对应代理方法
@property (nonatomic, weak, nullable) id <UITableViewDelegate> zxDelegate;

ZXTableViewConfig(ZXTableView配置文件)

///model默认去匹配的cell高度属性名 若不存在则动态生成cellHRunTime的属性名
static NSString *const CELLH = @"cellH";
///cell会自动赋值包含“model”的属性
static NSString *const DATAMODEL = @"model";
///model与cell的index属性，存储当前model与cell所属的indexPath
static NSString *const INDEX = @"indexPath";
///headerView与footerView的section属性，存储当前headerView与footerView所属的section
static NSString *const SECTION = @"section";
///若ZXBaseTableView无法自动获取cell高度（zxdata有值即可），且用户未自定义高度，则使用默认高度
static CGFloat const CELLDEFAULTH = 44;

#pragma mark - TableView默认偏好配置
///无数据是否显示HeaderView，默认为YES
static BOOL const ShowHeaderWhenNoMsg = YES;
///无数据是否显示FooterView，默认为YES
static BOOL const ShowFooterWhenNoMsg = YES;
///保持headerView不变（仅初始化一次），默认为NO
static BOOL const KeepStaticHeaderView = NO;
///保持footerView不变（仅初始化一次），默认为NO
static BOOL const KeepStaticFooterView = NO;
///禁止系统Cell自动高度 可以有效解决tableView跳动问题，默认为YES
static BOOL const DisableAutomaticDimension = YES;
///分割线样式，默认为UITableViewCellSeparatorStyleNone
static BOOL const DefaultSeparatorStyle =  UITableViewCellSeparatorStyleNone;
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 201,049评论 5赞 473
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 84,478评论 2赞 377
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 148,109评论 0赞 333
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 54,097评论 1赞 272
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 63,115评论 5赞 363
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 48,280评论 1赞 279
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 37,748评论 3赞 393
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,398评论 0赞 255
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 40,553评论 1赞 295
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,440评论 2赞 317
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,487评论 1赞 329
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,176评论 3赞 317
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 38,750评论 3赞 303
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,821评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,049评论 1赞 257
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 42,559评论 2赞 348
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,150评论 2赞 341

推荐阅读更多精彩内容