处理不等高TableViewCell
课题一:如何计算Cell高度
方案一:直接法(面向对象)
想知道妹纸爱你有多深?直接去问妹纸本人吧!
嗯!Cell也是一样的,想知道cell到底有多高?直接问Cell本人就好了。直接法,就是把数据布局到Cell上,然后拿到Cell最底部控件的MaxY值。
第一步:创建Cell并正确设置约束,使文字区域高度能够根据文字内容多少自动调整
第一步 - 添加好约束.gif第二步:再给这个Cell添加点别的东东,就叫这个东东BottomCub了。为Cub添加好约束。
第二步 - 随便添加点什么.gif第三步:为这个Cell写一个返回Cell高度 - 也就是BottomCub最大Y值的方法
#import "TestCell.h"
@interface TestCell ()
@property (strong, nonatomic) IBOutlet UILabel *longLabel;
@property (strong, nonatomic) IBOutlet UIView *bottomCub;
@end
@implementation TestCell
// Cell的构造方法
+ (instancetype)creatWithTitle :(NSString *)title inTableView :(UITableView *)tableView
{
TestCell *cell = [tableView dequeueReusableCellWithIdentifier:NSStringFromClass(self)];
if (!cell) {
cell = [[NSBundle mainBundle] loadNibNamed:NSStringFromClass(self) owner:nil options:kNilOptions].lastObject;
}
cell.longLabel.text = title;
return cell;
}
/**
* 拿到bottomCub的最大Y值并返回
*/
- (CGFloat)cellHeight
{
[self layoutIfNeeded]; // 一定要强制布局下,否则拿到的高度不准确
return CGRectGetMaxY(self.bottomCub.frame);
}
@end
- 第四步:在代理方法中设置Cell高度
*注意:计算Cell高度的过程,一定不要放在heightForRow代理方法中!这一点在后文中将会有所提及。
#import "AskCellViewController.h"
#import "TestCell.h"
@interface AskCellViewController ()<UITableViewDelegate,UITableViewDataSource>
@property (strong, nonatomic) UITableView *tableView;
/** 测试数据 - Cell中文字内容数组*/
@property(copy,nonatomic) NSArray *testTitleArray;
@end
@implementation AskCellViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self.view addSubview:self.tableView];
self.tableView.frame = self.view.bounds;
self.tableView.delegate = self;
self.tableView.dataSource = self;
self.tableView.tableFooterView = [[UIView alloc] init];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
TestCell *cell = [TestCell creatWithTitle:self.testTitleArray[indexPath.row] inTableView:tableView];
cell.selectionStyle = UITableViewCellSelectionStyleNone;
return cell;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
// *注意:计算Cell高度的过程,一定不要放在此代理方法中!这一点在后文中将会有所提及,此处仅为演示方便
CGFloat cellHeight = [[TestCell creatWithTitle:self.testTitleArray[indexPath.row] inTableView:tableView] cellHeight];
NSLog(@"%f",cellHeight);
return cellHeight;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return self.testTitleArray.count;
}
#pragma mark - Lazy
- (UITableView *)tableView
{
if (!_tableView) {
_tableView = [[UITableView alloc] init];
}
return _tableView;
}
- (NSArray *)testTitleArray
{
return @[@"我是第一个Cell",@"我是第二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二个Cell",@"我是第三个Cell"];
}
@end
- 效果
动态设定Cell高度结果.gif
方案二:自己算(面向过程)
想知道妹纸爱你有多深?自己来算算看~
通常情况下,Cell之所以不等高,是因为Cell内部文字区域的高度会根据文字数量动态变化,图片区域的高度会根据图片数量而自动变化。也就是说,只要知道文字区域的高度、图片区域的高度,就可以硬生生计算出Cell的高度了。
- 第一步:硬生生的将每个Cell的高度算出来,并保存在一个数组中
- 第二步:heightForRow方法中返回相应的CellHeight
#import "CalculatorViewController.h"
#import "TestCell.h"
@interface CalculatorViewController ()<UITableViewDelegate,UITableViewDataSource>
@property (strong, nonatomic) UITableView *tableView;
/** 测试数据 - Cell中文字内容数组*/
@property(copy,nonatomic) NSArray *testTitleArray;
/** 用来存Cell高度的数组*/
@property(copy,nonatomic) NSArray *cellHeightArray;
@end
@implementation CalculatorViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self.view addSubview:self.tableView];
self.tableView.frame = self.view.bounds;
self.tableView.delegate = self;
self.tableView.dataSource = self;
self.tableView.tableFooterView = [[UIView alloc] init];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
TestCell *cell = [TestCell creatWithTitle:self.testTitleArray[indexPath.row] inTableView:tableView];
cell.selectionStyle = UITableViewCellSelectionStyleNone;
return cell;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
CGFloat cellHeight = [self.cellHeightArray[indexPath.row] floatValue];
return cellHeight;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return self.testTitleArray.count;
}
#pragma mark - Lazy
- (UITableView *)tableView
{
if (!_tableView) {
_tableView = [[UITableView alloc] init];
}
return _tableView;
}
- (NSArray *)testTitleArray
{
return @[@"我是第一个Cell",@"我是第二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二个Cell",@"我是第三个Cell"];
}
- (NSArray *)cellHeightArray
{
NSMutableArray *cellHeightTMPArray = [@[] mutableCopy];
// 开始硬生生的计算每一个Cell高度
for (NSString *string in self.testTitleArray) {
CGFloat cellHeight = 0;
// 一个Cell由两部分组成 - 高度自动调整的Label & bottomCub
// bottomCub高度是确定的 - 120,Label和bottomCub之间的间距是确定的 - 8
static CGFloat bottomCubHeight = 120;
static CGFloat bottomMargin = 8;
// 计算Label的高度 - 其实就是计算Lable中的String的总高度
// 1. 拿到将要放入Lable的String
NSString *stringForLabel = string;
// 2. 根据文字内容、字体(固定值)、文字区域最大宽度计算String总高度
static CGFloat fontSize = 17;
CGFloat labelHeight = [stringForLabel sizeWithFont:[UIFont systemFontOfSize:fontSize] constrainedToSize:CGSizeMake(self.tableView.frame.size.width, CGFLOAT_MAX)].height;
// 3. 拿到了总高度,放入数组
cellHeight = labelHeight + bottomMargin + bottomCubHeight;
[cellHeightTMPArray addObject:@(cellHeight)];
}
return cellHeightTMPArray;
}
@end
- 效果
ummmm就不给效果图了哦,和上一张是一样一样的~
方案三:利用iOS8新特性
想知道妹纸爱你有多深?知道这个干嘛,直接通过iOS8,让妹纸爱上你不就好啦~
其实,iOS8已经提供了直接通过XIB让Cell高度自适应的方法了,只要简单拖拖线,根本木有必要计算Cell高度,就可以搞定不等高Cell
- 第一步:设置tableView的估算Cell高度&rowHeight值为自动计算模式
- (void)viewDidLoad {
[super viewDidLoad];
self.tableView.estimatedRowHeight = 100; // 随便设个不那么离谱的值
self.tableView.rowHeight = UITableViewAutomaticDimension;
}
- 第二步:为Cell中最下面的View设置约束 - 除了要定高、定宽、左上角粘着Label外,还要设置bottom距contentView的bottom间距为固定值,如0

- 第三步:一定要注意 - 不能实现heightForRow代理方法!!!不能实现heightForRow代理方法!!!不能实现heightForRow代理方法!!!重要的事情说三遍...
- (CGFloat)tableView:(UITableView )tableView heightForRowAtIndexPath:(NSIndexPath )indexPath
{
return 1000;
}iOS8新特性实现Cell高度的自适应.gif - 效果:一样杠杠滴~
课题二:在哪计算Cell高度
方案一:在heightForRow代理方法中计算
- 示例代码:见课题一方案一
- 说明:在这里进行计算是非常糟糕的选择,因为系统调用heightForRow方法非常频繁 感兴趣的小伙伴可以打印测试下...在这里进行计算,意味着系统每调用一次heightForRow方法,就会执行一次高度计算...好可怕有木有
处理不等高TableViewCell的更多相关文章
- iOS之处理不等高TableViewCell的几种方法
课题一:如何计算Cell高度 方案一:直接法(面向对象) 直接法,就是把数据布局到Cell上,然后拿到Cell最底部控件的MaxY值. 第一步:创建Cell并正确设置约束,使文字区域高度能够根据文字内 ...
- 自定义不等高cell—storyBoard或xib自定义不等高cell
1.iOS8之后利用storyBoard或者xib自定义不等高cell: 对比自定义等高cell,需要几个额外的步骤(iOS8开始才支持) 添加子控件和contentView(cell的content ...
- iOS-UI控件之UITableView(三)- 自定义不等高的cell
Storyboard_不等高 对比自定义等高cell,需要几个额外的步骤(iOS8开始才支持) 添加子控件和contentView之间的间距约束 设置tableViewCell的真实行高和估算行高 / ...
- flexbox实现不等宽不等高的瀑布流布局
第一次做不等宽不等高的瀑布流布局,刚开始企图用ccs3的column属性+flexbox来实现,瞎捣鼓半天都没有能弄好, 弱鸡哭晕在厕所(┬_┬),气的午饭都没有吃. 后来逼着自己冷静下来,又捣鼓了1 ...
- iOS开发——UI进阶篇(三)自定义不等高cell,如何拿到cell的行高,自动计算cell高度,(有配图,无配图)微博案例
一.纯代码自定义不等高cell 废话不多说,直接来看下面这个例子先来看下微博的最终效果 首先创建一个继承UITableViewController的控制器@interface ViewControll ...
- wpf ListBox,item两列不等高。
业务有这样的需求,类似瀑布流.内容两列不等高展示. 只需要继承panel,重写MeasureOverride和ArrangeOverride方法就行了. 很简单,内容都在代码里. using Syst ...
- 不等高cell的tableView界面搭建
一.搭建界面 1.界面分析 分析界面的层次结构,分析界面应该用什么控件来搭建 2.界面层次结构 分析之后,我们可以把这个界面分为四个模块(topView middleView commentView ...
- iOS-UI控件之UITableView(二)- 自定义不等高的cell
不等高的cell 给模型增加frame数据 所有子控件的frame cell的高度 @interface XMGStatus : NSObject /**** 文字\图片数据 ****/ // ... ...
- input 与 button 的问题 (空隙/不等高/对不齐)及 解决办法
1. input 与 button 为什么有空隙? - 要明白为什么,需要了解一下几点基础知识(耐心看完,你会发现竟如此简单) 1. input 与 button 都属于行级块元素,都具有文本 ...
随机推荐
- idhttp.post方式 调用datasnap rest 远程方法
idhttp.get方式调用,这种比较简单,大家都会.post方式网上却没有任何成功的代码,本人也是摸索了一个上午才搞定. 分享给大家. (1)post方式调用的远程方法,方法名必须加“update” ...
- iOS - Xcode升级到5.1& iOS升级到iOS7.1问题:Undefined symbols for architecture x86_64
Xcode升级到5.1 新特性之一就是默认让所有App都通过64位编译器编译.原来在Xcode5.0.x的时候默认的Standard architectures只有(arm7,armv7s),到5.1 ...
- iOS学习之NSBundle介绍和使用
iOS学习之NSBundle介绍和使用 http://blog.csdn.net/totogo2010/article/details/7672271 新建一个Single View Applicat ...
- SQLite数据库入门教程
SQLite数据库入门教程 SQLite 是一个开源的嵌入式关系数据库,实现自包容.零配置.支持事务的SQL数据库引擎. 其特点是高度便携.使用方便.结构紧凑.高效.可靠. 与其他数据库管理系统不同, ...
- ECSHOP在线手册布局参考图--文章详情页 article.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- BZOJ 1151 傲娇的人 排序
傲娇的人 Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/show/1151 Descrip ...
- 眼下最好的JSP分页技术
2005-08-24 来源:CSDN 作者:wanchao2001 前言 在使用数据库的过程中,不可避免的须要使用到分页的功能,但是JDBC的规范对此却没有非常好的解决.对于这个需求非 ...
- ValueStack基础:OGNL
ValueStack基础:OGNL 要了解ValueStack,必须先理解OGNL(Object Graphic Navigatino Language)! OGNL是Struts2中使用的一种表达式 ...
- mysqldump原理3
现网中数据库运维时,要经常对数据库做热备.为保证恢复时数据的完整性与一致性, 一种方法是在备份之前锁表,但锁表会影响正在运行的业务. mysqldump是当前MySQL中最常用的备份工具,通过mysq ...
- android的界面编程
主要是用View以及ViewGroup,同时ViewGroup又是View的子类,充当容器. 主要有两种方法控制view的行为: 1.在XML布局文件中通过XML属性进行控制 2.在Java代码中通过 ...
- iOS之处理不等高TableViewCell的几种方法