計算tableView不等高cell高度的幾種方法

OneAlon發表於2017-12-20

文章從簡書搬家到掘金

這裡利用heightForRowAtIndexPath:方法計算不等高cell的高度,在使用這個方法之前要明確這個方法的呼叫時間以及呼叫次數:

  • 1.每當reloadData時,有多少條資料,就會呼叫多少次這個方法(比如一共有80條資料,就會呼叫80次這個方法)
  • 2.每當有cell出現時,就會呼叫一次這個方法
//返回cell的高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return cellHeight;
}
複製程式碼

  • 用於描述cell的xib
    xib.png

####計算不等高cell高度的第一種方法:估算高度

  • 1.在viewDidLoad方法中設定cell的估算高度
(void)viewDidLoad {
    [super viewDidLoad];
    //設定估算高度
    self.tableView.estimatedRowHeight = 170;
}
複製程式碼
  • 2.在heightForRowAtIndexPath:方法中計算cell的高度
//定義間距
#define WYLMargin 10
//返回cell的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //獲取對應的模型
    WYLTopicItem *item = self.topicItemArray[indexPath.row];
    
    //定義cell的高度
    CGFloat cellHeight = 0;
    
    //圖片+間距
    cellHeight += WYLMargin + 35 + WYLMargin;
    
    //label的高度
    CGSize textMaxSize = CGSizeMake([UIScreen mainScreen].bounds.size.width - 2 * WYLMargin, MAXFLOAT);
    CGFloat labelHeight = [item.text boundingRectWithSize:textMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName : [UIFont systemFontOfSize:15]} context:nil].size.height;
    cellHeight += labelHeight + WYLMargin;
    
    //底部導航欄的高度
    cellHeight += 35 + WYLMargin;
    NSLog(@"heightForRowAtIndexPath-----%zd",indexPath.row);
    
    return cellHeight;
}
複製程式碼
  • 3.利用估算高度計算cell高度的優點和缺點
  • 優點: 1.減少heightForRowAtIndexPath方法的呼叫次數 2.可以讓暫時看不見的cell的高度延遲計算
  • 缺點: 1.tableView的contentSize不太準確 2.在tableView滑動過程中,滾動條的長度會變來變去,可能會有跳躍效果 3.cell從快取池中載入時又會重新計算它的高度

####計算不等高cell高度的第二種方法:定義字典儲存cell高度

  • 1.定義儲存cell高度的字典
/** 儲存cell高度的字典*/
@property (nonatomic ,strong) NSMutableDictionary *cellHeightDict;
/** 懶載入儲存cell高度的字典*/
-(NSMutableDictionary *)cellHeightDict
{
    if (_cellHeightDict == nil) {
        _cellHeightDict = [NSMutableDictionary dictionary];
    }
    
    return _cellHeightDict;
}
複製程式碼
  • 2.在heightForRowAtIndexPath:方法中計算cell的高度
//返回cell的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //獲取對應的模型
    WYLTopicItem *item = self.topicItemArray[indexPath.row];
    
    //用模型的地址作為字典的key
    NSString *key = [NSString stringWithFormat:@"%p",item];
    
    //取出模型對應的cell的高度
    CGFloat cellHeight = [self.cellHeightDict[key] doubleValue];
    
    //如果cellHeight有值,就是cell的高度已經計算過了,直接返回
    if (cellHeight) return cellHeight;
    
    //如果cell的高度沒有計算過,就計算cell高度
    //圖片+間距
    cellHeight += WYLMargin + 35 + WYLMargin;
    
    //label的高度
    CGSize textMaxSize = CGSizeMake([UIScreen mainScreen].bounds.size.width - 2 * WYLMargin, MAXFLOAT);
    CGFloat labelHeight = [item.text boundingRectWithSize:textMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName : [UIFont systemFontOfSize:15]} context:nil].size.height;
    cellHeight += labelHeight + WYLMargin;
    
    //底部導航欄的高度
    cellHeight += 35 + WYLMargin;

    //將計算過的cell高度儲存到字典中
    self.cellHeightDict[key] = @(cellHeight);
    NSLog(@"heightForRowAtIndexPath----%zd",indexPath.row);
    
    return cellHeight;
}
複製程式碼
  • 3.利用字典儲存cell高度的優缺點
  • 優點: 當cell重新載入到tableView中的時候,不會重複計算cell的高度
  • 缺點: 程式碼太過繁瑣

####計算不等高cell高度的第三種方法:在模型中定義cellHeight屬性

  • 1.在模型.h檔案中增加cellHeight屬性
#import <Foundation/Foundation.h>
@interface WYLTopicItem : NSObject
/** 根據當前模型資料計算出來的cell高度*/
@property (nonatomic ,assign) NSInteger cellHeight;
@end
複製程式碼
  • 2.在模型.m檔案中實現cellHeight的getter方法
#import "WYLTopicItem.h"
@implementation WYLTopicItem
-(NSInteger)cellHeight
{
    //如果cellHeight已經計算過,就直接返回
    if (_cellHeight) return _cellHeight;
 
    //圖片+間距
    _cellHeight += WYLMargin + 35 + WYLMargin;
    
    //label的高度
    CGSize textMaxSize = CGSizeMake([UIScreen mainScreen].bounds.size.width - 2 * WYLMargin, MAXFLOAT);
    CGFloat labelHeight = [self.text boundingRectWithSize:textMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName : [UIFont systemFontOfSize:15]} context:nil].size.height;
    _cellHeight += labelHeight + WYLMargin;
    
    //底部導航欄的高度
    _cellHeight += 35 + WYLMargin;
    
    return _cellHeight;
}
@end
複製程式碼

-3.在heightForRowAtIndexPath:方法中計算cell的高度

//返回cell的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //獲取對應的模型
    WYLTopicItem *item = self.topicItemArray[indexPath.row];
    return item.cellHeight;
}
複製程式碼

效果圖.png

相關文章