处理不等高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 都属于行级块元素,都具有文本 ...
随机推荐
- 转载 ASP.NET常用的正则表达式
转载原地址: http://www.cnblogs.com/0001/archive/2010/01/26/1656677.html 常用表达式: "^\d+$" //非负整数(正 ...
- jquery validation 简单验证手机号码
js代码 // 手机号码验证 jQuery.validator.addMethod("isMobile", function(value, element) { var lengt ...
- EASYUI- EASYUI左移右移 GRID中值
EASYUI左移右移 GRID中值 $("#addAll").click(function(){ var ids = []; var names = []; var srcrows ...
- XMPP——Smack[5]文件传输及离线消息的获取
三天时间,赶在最后一下午实现了文件的传输,本来需要实现离线文件的发送的,一直没想好怎么弄,找openfire的离线文件插件没找到,后来想出一种方法,起服务器时起了一个系统用户,一直在线,当用户发送离线 ...
- 【转】C++及java在内存分配上的区别
转自:http://blog.csdn.net/qinghezhen/article/details/9116053 C++内存分配由五个部分组成:栈.堆.全局代码区.常量区.程序代码区.如下图所示: ...
- Cocos2dx 小技巧(十一) 小人虽短,但能够旋转
转眼五一就到了,放假三天应该做些什么呢?窝在家里钻研技术?写博客?no no no no,这样的"伤害"自己的方式实在让我无法忍受.本来和大学那伙人越好了一起去哪里玩玩,喝酒聊天啥 ...
- hdu 5443 The Water Problem 线段树
The Water Problem Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php? ...
- JavaScript(20)jQuery HTML 加入和删除元素
jQuery - 加入元素 通过 jQuery,能够非常easy地加入新元素/内容. 加入新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepen ...
- 如何选择一个 Linux Tracer (2015)
http://www.oschina.net/translate/choosing-a-linux-tracer
- (原)C++解析XML生成类对象_v1.0 函数指针
要写一个xml解析,解析后获得到的数据变成各个类的对象. 解析有现成的库,使用tinyxml,但是解析出来的类库如何变成各个类的对象, 例如一下这个xml, <musics> <mu ...
- iOS之处理不等高TableViewCell的几种方法