簡介
我們在使用mansory的過程中,發現用布局控件很快、很容易,但是具體到怎么計算UITableViewCell的高度的時候,如果不是用得故事版和XIB,就遇到了麻煩。在公司中團隊開發一般是用純代碼寫的比較多,因為這樣便于多人開發和日后的維護;但是我們使用了autolayout就沒有了frame的概念,那怎么計算cell的高度呢?
了解tableView數據源方法的調用順序
- 先調用 ,返回多少組(會被多次調用,兩次)
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
- 然后調用,返回某個單元格內容(會被多次調用)
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
- 再調用,返回這個單元格的高度(會被多次調用)
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
使用mansory約束控件時,如何才能夠自動計算cell的高度?
1 需要利用到模型數據來計算出cell的總的高度
2 cell需要提供一個接口給外界調用,傳入模型數據來計算cell的高度
-(CGFloat)rowHeightWithCellModel:(HomeModel *)homeModel;
3 注意性能優化,由于tableView的滾動,模型數據被反復設置,而cell的高度只需要利用獲得的模型數據計算一次就可以,使用懶加載的方式計算高度,當模型數據重新獲取時,重新計算
self.tableView.separatorStyle=UITableViewCellSeparatorStyleNone;//去掉默認下劃線
self.tableView.estimatedRowHeight=200; //預估行高 可以提高性能
self.tableView.rowHeight = 88;
模型的屬性
HomeModel.h
//單元格的高度
@property (nonatomic,assign) CGFloat cellHeight;
HomeModel.m
//惰性初始化是這樣寫的
-(CGFloat)cellHeight
{
//只在初始化的時候調用一次就Ok
if(!_cellHeight){
HomeViewCell *cell=[[HomeViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:homeIndentifier];
// 調用cell的方法計算出高度
_cellHeight=[cell rowHeightWithCellModel:self];
NSLog(@"計算的高度是:%f", _cellHeight);
}
return _cellHeight;
}
cell在創建的時候,初始化自己的子控件,添加約束,把能添加的約束都添加上,但是還有某些控件的高度是由數據決定的,有些控件的高度是固定的,而某些控件還缺少必要的高度約束,在cell提供的接口-(CGFloat)rowHeightWithCellModel:(HomeModel *)homeModel方法中補上,調用[self layoutIfNeeded];更新約束
//在表格cell中 計算出高度
-(CGFloat)rowHeightWithCellModel:(HomeModel *)homeModel
{
_homeModel=homeModel;
__weak __typeof(&*self)weakSelf = self;
//設置標簽的高度
[self.content mas_makeConstraints:^(MASConstraintMaker *make) {
// weakSelf.contentLabelH 這個會調用下面的懶加載方法
make.height.mas_equalTo(weakSelf.contentLabelH);
}];
// 2. 更新約束
[self layoutIfNeeded];
//3. 視圖的最大 Y 值
CGFloat h= CGRectGetMaxY(self.content.frame);
return h+marginW; //最大的高度+10
}
/*
* 懶加載的方法返回contentLabel的高度 (只會調用一次)
*/
-(CGFloat)contentLabelH
{
// 標簽的高度
if(!_contentLabelH){
CGFloat h=[self.homeModel.content boundingRectWithSize:CGSizeMake(([UIScreen mainScreen].bounds.size.width)-2*marginW, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:16]} context:nil].size.height;
_contentLabelH=h+marginW; //內容距離底部下劃線10的距離
}
return _contentLabelH;
}
cell初始化子控件
#pragma mark 添加子控件
-(void)setupUI
{
//1.添加圖片
UIImageView *icon=[UIImageView new];
icon.contentMode=UIViewContentModeScaleAspectFill;
icon.clipsToBounds=YES;
[self.contentView addSubview:icon];
self.icon=icon;
//2.添加label
UILabel *content=[UILabel new];
content.numberOfLines=0; //多行顯示
content.font=[UIFont systemFontOfSize:16];
[self.contentView addSubview:content];
self.content=content;
//3.底部添加一條線
UIImageView *line=[UIImageView new];
line.backgroundColor=[UIColor grayColor];
[self.contentView addSubview:line];
self.line=line;
//設置約束
__weak __typeof(&*self)weakSelf = self;
//1.設置圖片的大小
[self.icon mas_makeConstraints:^(MASConstraintMaker *make) {
make.height.mas_equalTo(iconH); //頭像的高度
make.width.mas_equalTo(iconW); //頭像的寬度
make.top.equalTo(weakSelf.mas_top).offset(marginW) ; //距離頂部10的距離
make.centerX.equalTo(weakSelf.mas_centerX); //頭像的中心x和cell的中心x一樣
// make.centerY.equalTo(self.mas_centerY); 頭像的中心y和cell的中心y一樣
}];
//2.設置contentLabel
[self.content mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(weakSelf.icon.mas_bottom).offset(marginW); //文本距離頭像底部10個間距
make.left.equalTo(weakSelf.mas_left).offset(marginW); //文本距離左邊的距離
make.right.equalTo(weakSelf.mas_right).offset(-marginW); //文本距離右邊的距離
//文本高度 我們在數據源方法中獲取模型中cellHeight屬性時再計算
#warning 未完待續。。。
}];
//3.設置下劃線的大小
[self.line mas_makeConstraints:^(MASConstraintMaker *make) {
make.height.mas_equalTo(0.5);
make.left.equalTo(weakSelf.mas_left).offset(0);
make.right.equalTo(weakSelf.mas_right).offset(0);
make.bottom.equalTo(weakSelf.mas_bottom).offset(-marginW); //下劃線距離底部10的距離
}];
}
tableView的數據源方法和代理方法
/*
返回多少行
*/
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
//因為是我們自定義的數據 所以 這里寫arr而不是arrModel 因為只有這樣才會調用arr的懶加載犯法
return self.arr.count;
}
/*
返回表格單元
*/
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
//取出模型
HomeModel *model=self.arrModel[indexPath.row];
HomeViewCell *cell = [tableView dequeueReusableCellWithIdentifier:homeIndentifier];
if (cell == nil) {
cell = [[HomeViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:homeIndentifier];
}
//傳遞模型給cell
cell.homeModel=model;
return cell;
}
/*
* 返回每一個表格單元的高度
*/
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
//取出模型
HomeModel *homeModel=self.arrModel[indexPath.row];
return homeModel.cellHeight ;
}