我的编程空间,编程开发者的网络收藏夹
学习永远不晚

你应该知道的tableViewCell行高计算处理

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

你应该知道的tableViewCell行高计算处理

前言

UITableView 是在app界面里非常常用的一个控件了,打开一个app,内容列表 作者列表 朋友圈列表等等,,,都离不开 UITableView 。

而 UITableView 的精髓,则是在 UITableViewCell 展现的, 最常用的 自定义cell 有的行高是固定的,而大部分 则需要根据内容来计算行高展示的。

下面就说说我在实际开发中处理cell行高的几种情况:

1. 不需要动态计算高度

我在写tableview时,基本都是自定义cell,而所有的自定义cell,都会继承一个基类BaseTableViewCell:

.h里:


.h里:
// 重用标识
+ (NSString *)reuseIdentifier;
// cell高度
+ (CGFloat)staticHeight;

.m里:
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
 self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
 if (self) {
 self.opaque = NO;
 self.selectionStyle = UITableViewCellSelectionStyleNone;
 }
 return self;
}

// 重用标识
+ (NSString *)reuseIdentifier {
 return NSStringFromClass([self class]);
}

// cell高度
+ (CGFloat)staticHeight {
 return 44.f;
}

这样写的好处是,当我们在使用tableview时,会方便我们对重用标识符 行高使用,看一下:

staticHeight可以在子类的自定义cell里更改设置,使用时:

这样写,更能清晰明了的看到对每个自定义cell的设置,也会让代码看上去优雅整齐一些。

2. 动态计算高度

实际开发中,使用最多的应该是动态计算cell高度了,这也是tableView很基本的一个功能。

比如搜索资讯这块:

标题高度不固定,内容高度不固定,标签不固定,这样的就需要根据model里的内容计算行高了:

用的时候,在tableview的代理里设置:


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
  WMSearchResultQAModel *model = self.dataArray[indexPath.row];
  return [WMSearchResultQAModel calutWholeCellHeightWithModel:model];
}

这样就可以达到每个cell根据内容展示不同高度的要求了。

这种方法很繁琐,但是也是最精确的,最可控的,都支持autolayout和frame。

3. 动态计算 - 缓存高度

为什么要缓存高度?

因为当tableView滚动时会不停的回调 heightForRowAtIndexPath 这个代理方法,当cell的高度需自适应内容时,就意味着每次回调这个方法时都要计算高度,而计算是要花时间了,在用户体验上的体现就是卡顿,众所周知 60fps是比较符合人眼审视的,如果帧数 低于这个数值过多,就会明显感受到卡帧等现象,为了让用户体验比较好些,我们就要对高度计算进行优化。

思路:为了避免重复且无意义的计算cell高度,缓存高度就显得尤为重要了。

缓存高度机制

缓存高度 我们需要一个容器来保存高度数值,可以是model 可以是一个可变数组 也可以是一个可变字典,以达到每当回调 heightForRowAtIndexPath 这个方法时,我们先去这个缓存里去取,如果有,就直接拿出来,如果没有,就计算高度,并且缓存起来。

以model为例:

在model里声明个cellHeight属性,用于保存Model所对应的Cell的高度,然后在 heightForRowAtIndexPath 方法中,如果当前Model的cellHeight为0,说明这个Cell没有缓存过高度,则计算Cell的高度,并把这个高度记录在Model中,这样下次再获取这个Cell的高度,就可以直接去Model中获取,而不用重新计算:


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
 WMSearchResultQAModel *model = self.dataArray[indexPath.row];
 if (model.cellHeight > 0) {
  // 有缓存的高度,取出缓存高度
  return model.cellHeight;
 }
 // 没有缓存时,计算高度并缓存起来
 CGFloat cellHeight; = [WMSearchResultQAModel calutWholeCellHeightWithModel:model];
 // 缓存给model
 model.cellHeight = cellHeight;
 return cellHeight;
}

这样就实现了高度缓存和Model、Cell都对应的优化,我们无需手动管理高度缓存,在添加和删除数据的时候,都是对Model在数据源中进行添加或删除。

而如果使用可变数组或可变字典时,则需要额外的在刷新tableView时对其进行清空处理。

4. 自适应高度

在 iOS8 之后,系统结合autolayout提供了动态结算行高的方法 UITableViewAutomaticDimension,做好约束,我们都不用去实现 heightForRowAtIndexPath 这个代理方法了。

masonry支持毫无压力。

实现步骤:

tableView设置


// 预设行高
self.tableView.estimatedRowHeight = xxx;
// 自动计算行高模式 
self.tableView.rowHeight = UITableViewAutomaticDimension;

在自定义cell里,masonry布局,比如:


- (void)layoutSubviews {
 [super layoutSubviews];
 [self.headImgView mas_makeConstraints:^(MASConstraintMaker *make) {
  make.top.left.offset(kSpace15);
  make.size.mas_equalTo(CGSizeMake(50.f, 50.f));
  // 在自动计算行高模式下 要加上的 
  make.bottom.equalTo(self.contentView.mas_bottom).offset(-kSpace15);
 }];
 [self.nickNameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
  make.left.equalTo(self.headImgView.mas_right).offset(12.f);
  make.top.offset(17.f);
 }];
 [self.jobWorkLabel mas_makeConstraints:^(MASConstraintMaker *make) {
  make.left.equalTo(self.nickNameLabel.mas_right).offset(8.f);
  make.right.lessThanOrEqualTo(self.contentView.mas_right).offset(-kSpace15);
  make.top.offset(21.f);
 }];
 [self.hospitalLabel mas_makeConstraints:^(MASConstraintMaker *make) {
  make.left.equalTo(self.headImgView.mas_right).offset(12.f);
  make.top.equalTo(self.jobWorkLabel.mas_bottom).offset(6.f);
 }];
 [self.line mas_makeConstraints:^(MASConstraintMaker *make) {
  make.left.right.bottom.offset(0);
  make.height.mas_equalTo(0.5f);
 }];
}

布局时两个注意点:

· 所有子控件,都要依赖与self.contentView作为约束父控件,而不是self(cell)

· 关键控件要做bottom约束 (因为不再指定行高,所以要需要给出根据bottom的约束)

最关键的一步: [cell layoutIfNeeded]


- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
 WMDoctorEvaluateDescribeInputCell *cell = [tableView dequeueReusableCellWithIdentifier:[WMDoctorEvaluateDescribeInputCell reuseIdentifier] forIndexPath:indexPath];
 kWeakSelf
 cell.describeInputBlock = ^(NSString * _Nonnull describeText) {
   weakSelf.inputDescribeText = describeText;
  };
 //关键的一步,解决不正常显示问题
 [cell layoutIfNeeded];
 return cell;
}

这样就完成了自动适应高度的要求了。

另外:

针对一些自动适应高度不好做的cell,可以单独处理 如下:


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
 if (indexPath.section == 2) {
   return [WMDoctorEvaluateStarCell staticHeight];
 }
 return UITableViewAutomaticDimension;
}

5.自适应高度 - 缓存行高

在用UITableViewAutomaticDimension,有的界面比较复杂,虽然这样能完成显示,但是在滑动的过程中,能肉眼感受到卡 掉帧,众所周知 60fps是比较符合人眼审视的,如果帧数 低于这个数值过多,就会明显感受到卡帧等现象,这属于优化性能方面的问题,所以就要思考一下怎样来达到优化tableview性能。

思路:

缓存高度机制

首先获取cell实际显示的高度


- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath 
{
 NSString *key = [NSString stringWithFormat:@"%ld", (long)indexPath.row];
 [self.heightDict setObject:@(cell.height) forKey:key];
 NSLOG(@"第%@行的计算的最终高度是%f",key,cell.height);
}

//didEndDisplayingCell 当cell滑出屏幕时会触发此方法,是cell已经被真正的显示在了屏幕上,所以在这里打印出的高度必然是最正确的高度。根据indexPath.row作为key,将高度缓存进字典.

然后在 heightForRowAtIndexPath 方法里判断,如果字典里有值,则使用缓存高度,否则自动计算:


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
 NSString *key = [NSString stringWithFormat:@"%ld",indexPath.row];
 if (self.heightDict[key] != nil) {
  NSNumber *value = _heightDict[key];
  return value.floatValue;
 }
 return UITableViewAutomaticDimension;
}

注意:设置cell的预估高度时一定要设置最小高度cell的那个值。不然的话,在滑动的时候,当高度最小的那个滑动到一大半的时候,就会突然一下消失,造成掉帧的现象。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对编程网的支持。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

你应该知道的tableViewCell行高计算处理

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

你应该知道的tableViewCell行高计算处理

前言 UITableView 是在app界面里非常常用的一个控件了,打开一个app,内容列表 作者列表 朋友圈列表等等,,,都离不开 UITableView 。而 UITableView 的精髓,则是在 UITableViewCell 展现
2022-05-28

你应该知道的几类npm依赖包管理详解

前言 大家都知道在一个Node.js项目中,package.json几乎是一个必须的文件,它的主要作用就是管理项目中所使用到的外部依赖包,同时它也是npm命令的入口文件。下面话不多说了,来一起看看详细的介绍把。npm 目前支持以下几类依赖包
2022-06-04

SQLServer 错误 17142 SQL Server 服务已经暂停。 不允许进行新的连接。 要恢复此服务,请使用 SQL 计算机管理器或控制面板中的服务应用程序。 故障 处理 修复 支持远程

详细信息 Attribute 值 产品名称 SQL Server 事件 ID 17142 事件源 MSSQLSERVER 组件 SQLEngine 符号名称 INIT_SRVC_PAUSED 消息正文 SQL ...
SQLServer 错误 17142 SQL Server 服务已经暂停。 不允许进行新的连接。 要恢复此服务,请使用 SQL 计算机管理器或控制面板中的服务应用程序。 故障 处理 修复 支持远程
2023-11-05

编程热搜

  • Android:VolumeShaper
    VolumeShaper(支持版本改一下,minsdkversion:26,android8.0(api26)进一步学习对声音的编辑,可以让音频的声音有变化的播放 VolumeShaper.Configuration的三个参数 durati
    Android:VolumeShaper
  • Android崩溃异常捕获方法
    开发中最让人头疼的是应用突然爆炸,然后跳回到桌面。而且我们常常不知道这种状况会何时出现,在应用调试阶段还好,还可以通过调试工具的日志查看错误出现在哪里。但平时使用的时候给你闹崩溃,那你就欲哭无泪了。 那么今天主要讲一下如何去捕捉系统出现的U
    Android崩溃异常捕获方法
  • android开发教程之获取power_profile.xml文件的方法(android运行时能耗值)
    系统的设置–>电池–>使用情况中,统计的能耗的使用情况也是以power_profile.xml的value作为基础参数的1、我的手机中power_profile.xml的内容: HTC t328w代码如下:
    android开发教程之获取power_profile.xml文件的方法(android运行时能耗值)
  • Android SQLite数据库基本操作方法
    程序的最主要的功能在于对数据进行操作,通过对数据进行操作来实现某个功能。而数据库就是很重要的一个方面的,Android中内置了小巧轻便,功能却很强的一个数据库–SQLite数据库。那么就来看一下在Android程序中怎么去操作SQLite数
    Android SQLite数据库基本操作方法
  • ubuntu21.04怎么创建桌面快捷图标?ubuntu软件放到桌面的技巧
    工作的时候为了方便直接打开编辑文件,一些常用的软件或者文件我们会放在桌面,但是在ubuntu20.04下直接直接拖拽文件到桌面根本没有效果,在进入桌面后发现软件列表中的软件只能收藏到面板,无法复制到桌面使用,不知道为什么会这样,似乎并不是很
    ubuntu21.04怎么创建桌面快捷图标?ubuntu软件放到桌面的技巧
  • android获取当前手机号示例程序
    代码如下: public String getLocalNumber() { TelephonyManager tManager =
    android获取当前手机号示例程序
  • Android音视频开发(三)TextureView
    简介 TextureView与SurfaceView类似,可用于显示视频或OpenGL场景。 与SurfaceView的区别 SurfaceView不能使用变换和缩放等操作,不能叠加(Overlay)两个SurfaceView。 Textu
    Android音视频开发(三)TextureView
  • android获取屏幕高度和宽度的实现方法
    本文实例讲述了android获取屏幕高度和宽度的实现方法。分享给大家供大家参考。具体分析如下: 我们需要获取Android手机或Pad的屏幕的物理尺寸,以便于界面的设计或是其他功能的实现。下面就介绍讲一讲如何获取屏幕的物理尺寸 下面的代码即
    android获取屏幕高度和宽度的实现方法
  • Android自定义popupwindow实例代码
    先来看看效果图:一、布局
  • Android第一次实验
    一、实验原理 1.1实验目标 编程实现用户名与密码的存储与调用。 1.2实验要求 设计用户登录界面、登录成功界面、用户注册界面,用户注册时,将其用户名、密码保存到SharedPreference中,登录时输入用户名、密码,读取SharedP
    Android第一次实验

目录