UITableViewcell autolayout下动态高度
2015-07-14 11:38
549 查看
项目中最常用的一个UI就是UITableView了,iOS7、8进一步优化了复用机制,用起来相当爽。配合Autolayout,适配工作减轻了很多。
以前做适配工作都是在heightForRow里边先计算出来Cell的高度,然后再CellForRow写适配代码。工作量虽然不是很大,但是很繁琐。
相对于这种写法,如果减去计算height这步,工作量自然减少很多。首先给出一种我媳妇给提供的方法,这是她做聊天UI时由于过度计算而怒创的方法
,当时我看到就震惊了,之后我就一直用这个方法
。
使用这中方法即可省重复计算frame的操作,计算一次布局即可。
现在IOS7、8都出来这么久了,autolayout也炒的很热,现在看了下确实方便了很多。比我在iOS6方便多了。
前两天看了下autolayout,现在结合tableviewcell试试效果,看了几个demo,发现iOS7跟iOS8不一样,iOS8更加简单。
第一、iOS7 tableviewcell + autolayout
使用storyboard简单创建一个工程,并添加如下约束(不熟悉约束添加方法的可参考我之前的博客autolayout)
关联工程文件,Cell连线,复用标识符等(不熟悉,可参考我之前的博客):
重头戏来了,代码中改如何修改:
cellForRow依然是我们之前的写法,赋值:
重点在于计算height,修改方法如下:
有三点需要注意:
第一点:不要在heightForRow使用
- (id)dequeueReusableCellWithIdentifier:(NSString *)identifier forIndexPath:(NSIndexPath *)indexPath
你会发现进入了死循环。heightForRow->cellforRow->hei...Row
第二点:使用systemLayoutSizeFittingSize,他会根据约束条件算出来新的size,(所以约束条件一定要准确,很多BUG都是因为约束有问题)
它有两种参数:
UIKIT_EXTERN const CGSize UILayoutFittingCompressedSize NS_AVAILABLE_IOS(6_0);//紧凑,大小适中的最小尺寸
UIKIT_EXTERN const CGSize UILayoutFittingExpandedSize NS_AVAILABLE_IOS(6_0);//宽松
第三点:新的size计算的是contentview的size,Cell.size.height = content view.size.height+1,记得加上一个分割线的高度。
好的到这里看看运行效果:
咋一看感觉效果实现了,仔细观察发现label的高度算的不对,第三行label不只有三行,所以这个size算的不准。
经过研究发现,这个时候需要给label一个宽度值,这样才能算出来所需要的高度。可以设置label的这个属性来固定宽度。
// Support for constraint-based layout (auto layout)
// If nonzero, this is used when determining -intrinsicContentSize for multiline labels
@property(nonatomic) CGFloat preferredMaxLayoutWidth NS_AVAILABLE_IOS(6_0);
我们修改heightForRow的方法:
跑起来看看效果:
这才像个样子,哇哈哈。
这个属性也可以在storyboard中设置:
第二、iOS8 tableviewcell + autolayout
iOS7的方法已经简单很多了,不过iOS8更加简单:iOS8只需要两行代码加上约束即可完成适配!!
有木有很夸张!!
看方法:
看到没有,iOS8设置都不需要heightForRow了,只需要设置下预估高度
iOS7优化了tableview,获取Cell高度不再是一次性全部加载heightForRow,然后再生成Cell。而是先调用:
- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath
等Cell真正要呈现的时候在调用heightForRow。
真实的效果呢
高端大气上档次啊,哇哈哈。看看其他机型
哈哈,就是这么简单,Cell就是配好了!!!
总结一下:iOS7需要注意preferredMaxLayoutWidth的设置,iOS8需要设置estimatedRowHeight、rowHeight = UITableViewAutomaticDimension。更加注意的是约束的准确!!!
以前做适配工作都是在heightForRow里边先计算出来Cell的高度,然后再CellForRow写适配代码。工作量虽然不是很大,但是很繁琐。
相对于这种写法,如果减去计算height这步,工作量自然减少很多。首先给出一种我媳妇给提供的方法,这是她做聊天UI时由于过度计算而怒创的方法
,当时我看到就震惊了,之后我就一直用这个方法
。
使用这中方法即可省重复计算frame的操作,计算一次布局即可。
现在IOS7、8都出来这么久了,autolayout也炒的很热,现在看了下确实方便了很多。比我在iOS6方便多了。
前两天看了下autolayout,现在结合tableviewcell试试效果,看了几个demo,发现iOS7跟iOS8不一样,iOS8更加简单。
第一、iOS7 tableviewcell + autolayout
使用storyboard简单创建一个工程,并添加如下约束(不熟悉约束添加方法的可参考我之前的博客autolayout)
关联工程文件,Cell连线,复用标识符等(不熟悉,可参考我之前的博客):
重头戏来了,代码中改如何修改:
cellForRow依然是我们之前的写法,赋值:
<span style="color:#993399;">- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { TestCell *cell = [tableView dequeueReusableCellWithIdentifier:@"testCell" forIndexPath:indexPath]; NSLog(@"cell create..."); if (!cell) { NSLog(@"cell is nil!"); } cell.ts_label.text = self.data[indexPath.row]; return cell; }</span>
重点在于计算height,修改方法如下:
<span style="color:#993399;">- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { TestCell* cell = [tableView dequeueReusableCellWithIdentifier:@"testCell"]; cell.ts_label.text = self.data[indexPath.row]; CGSize size = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]; NSLog(@"size = %@ %lf",NSStringFromCGSize(size), cell.ts_label.preferredMaxLayoutWidth ); return size.height + 1; } </span>
有三点需要注意:
第一点:不要在heightForRow使用
- (id)dequeueReusableCellWithIdentifier:(NSString *)identifier forIndexPath:(NSIndexPath *)indexPath
你会发现进入了死循环。heightForRow->cellforRow->hei...Row
第二点:使用systemLayoutSizeFittingSize,他会根据约束条件算出来新的size,(所以约束条件一定要准确,很多BUG都是因为约束有问题)
它有两种参数:
UIKIT_EXTERN const CGSize UILayoutFittingCompressedSize NS_AVAILABLE_IOS(6_0);//紧凑,大小适中的最小尺寸
UIKIT_EXTERN const CGSize UILayoutFittingExpandedSize NS_AVAILABLE_IOS(6_0);//宽松
第三点:新的size计算的是contentview的size,Cell.size.height = content view.size.height+1,记得加上一个分割线的高度。
好的到这里看看运行效果:
咋一看感觉效果实现了,仔细观察发现label的高度算的不对,第三行label不只有三行,所以这个size算的不准。
经过研究发现,这个时候需要给label一个宽度值,这样才能算出来所需要的高度。可以设置label的这个属性来固定宽度。
// Support for constraint-based layout (auto layout)
// If nonzero, this is used when determining -intrinsicContentSize for multiline labels
@property(nonatomic) CGFloat preferredMaxLayoutWidth NS_AVAILABLE_IOS(6_0);
我们修改heightForRow的方法:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { TestCell* cell = [tableView dequeueReusableCellWithIdentifier:@"testCell"]; cell.ts_label.preferredMaxLayoutWidth = 260; cell.ts_label.text = self.data[indexPath.row]; CGSize size = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]; NSLog(@"size = %@ %lf",NSStringFromCGSize(size), cell.ts_label.preferredMaxLayoutWidth ); return size.height + 1; }
跑起来看看效果:
这才像个样子,哇哈哈。
这个属性也可以在storyboard中设置:
第二、iOS8 tableviewcell + autolayout
iOS7的方法已经简单很多了,不过iOS8更加简单:iOS8只需要两行代码加上约束即可完成适配!!
有木有很夸张!!
看方法:
<span style="color:#993399;">- (void)viewDidLoad { </span><span style="color:#663366;"> [super viewDidLoad]; self.data = @[@"hahahahahahahahahahahaha",@"gagagaga",@"lalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalalala",@"wawawawawawawawawawawawawawawawawawawawa",@"papapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapapa",@""]; self.tableView.estimatedRowHeight = 120; self.tableView.rowHeight = UITableViewAutomaticDimension; }</span>
<span style="color:#663366;">- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { TestCell *cell = [tableView dequeueReusableCellWithIdentifier:@"testCell" forIndexPath:indexPath]; NSLog(@"cell create..."); if (!cell) { NSLog(@"cell is nil!"); } cell.ts_label.text = self.data[indexPath.row]; return cell; }</span>
看到没有,iOS8设置都不需要heightForRow了,只需要设置下预估高度
<span style="color:#663366;">estimatedRowHeight</span>
<span style="color:#663366;"></span><pre name="code" class="objc"><span style="color:#663366;">rowHeight = UITableViewAutomaticDimension</span>
iOS7优化了tableview,获取Cell高度不再是一次性全部加载heightForRow,然后再生成Cell。而是先调用:
- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath
等Cell真正要呈现的时候在调用heightForRow。
真实的效果呢
高端大气上档次啊,哇哈哈。看看其他机型
哈哈,就是这么简单,Cell就是配好了!!!
总结一下:iOS7需要注意preferredMaxLayoutWidth的设置,iOS8需要设置estimatedRowHeight、rowHeight = UITableViewAutomaticDimension。更加注意的是约束的准确!!!
相关文章推荐
- 判断UITextField.text是否为空
- Introduction to Guid ( globally unique identifier )
- 嵌套循环中的 continue ,break
- OSGI Blueprint
- leetcode Repeated DNA Sequences 哈希表
- [SoapUI] 在某个测试步骤下面增加Script Assertion,运用 messageExchange 获取response content
- Functional MRI (second edition) -- 5. MR Contrast Mechanisms and Pulse Sequences
- easyui在ie下要注意的问题
- 芸芸毕业生
- 线性布局
- Assertion failure in -[UICGColor encodeWithCoder:]
- iOS隐藏UITableview下面多余的tableviewcell的线条
- iOS开发:UITableView加载多张照片导致内存上涨的问题
- 相对布局
- hibernate在使用sql查询query自动转化成model类型数据,query.addEntity
- 帧布局
- UITextField各种设置
- [Fri, 3 Jul 2015 ~ Tue, 7 Jul 2015] Deep Learning in arxiv
- ios UITableViewCell重用实现分析
- UILabel自适应里面的文字,自动调整宽度和高度