TableViewCell动态布局

在实际工作中，一个tableView中的cell根据数据的内容确定高度是很常见的一种形式，而且我们处理的方式也不一样。我喜欢用xib构建tableView的cell,以下是我自己总结的一些关于xib的常见的处理方法。

一个cell上面只有一个label

这是cell高度动态布局中最简单的一种方式，在layout出来之前我一直用这种方式计算得到cell的高度

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{    
 TestModel * model = self.dataArr[indexPath.row];
 CGFloat height = [model.title  boundingRectWithSize:CGSizeMake(200, 1000) options:NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading attributes:@{NSFontAttributeName : [UIFont systemFontOfSize:15]} context:nil].size.height;
return height + 10 + 10;

}

虽然这种方式也可以实现同样的效果，但是很明显他不符合autolayout思想，我们不能每次需要高度的时候都要手动算一次高度。经过查阅网上相关资料发现，苹果其实已经给出来这里计算cell高度的相关办法

TestModel * model = self.dataArr[indexPath.row];
TableViewCell1 * cell1 = [tableView dequeueReusableCellWithIdentifier:CELL_NAME1];
self.contentLabel.preferredMaxLayoutWidth = [UIScreen mainScreen].bounds.size.width - 20;
cell1.lblContent.text = model.title
CGSize size = [cell1.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]
return size.height + 0.5;

如果你是第一次接触这个方法你肯定对+0.5感到好奇，但是别小看这里的0.5，如果你不加，你最后一行显示很可能会不准确，这是什么原因造成的呢？打印下cell.frame,和cell.contentView.frame,你肯定会发现cell比cell.contentView高度大0.5。

如果你很不习惯+0.5才能得到正确的高度，那么你将cell.contentView写成cell，如代码：

TestModel * model = self.dataArr[indexPath.row];
TableViewCell1 * cell1 = [tableView dequeueReusableCellWithIdentifier:CELL_NAME1];
self.contentLabel.preferredMaxLayoutWidth = [UIScreen mainScreen].bounds.size.width - 20;
cell1.lblContent.text = model.title
CGSize size = [cell1 systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]
return size.height;

然后运行，界面显示的结果确实呈现了我们所想要的结果。

一个cell上面有上下两个label

这种情况和只有一个label的情况稍有不同。看代码

TestModel * model = self.dataArr[indexPath.row];
TableViewCell2 * cell2 = [tableView dequeueReusableCellWithIdentifier:CELL_NAME2];
self.contentLabel.preferredMaxLayoutWidth = [UIScreen mainScreen].bounds.size.width - 20;
self.titleLabel.preferredMaxLayoutWidth = [UIScreen mainScreen].bounds.size.width - 20;
cell2.lblContent.text = model.title
CGSize size = [cell2 systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]
return size.height;

然后运行，界面显示的结果确实呈现了我们所想要的结果，但是先别急，我们看看打印信息，此时会发现有一大堆约束冲突，我看了里面的一些相关报错，删除了一些约束都不生效，很懊恼。不过随后我在网上查到了相关资料，其实只需要将UILayoutFittingCompressedSize改成UILayoutFittingExpandedSize,再重新运行，没有约束冲突了，结果也很完美。如果我们用cell.contentView，或者一个label和两个label的做法基本相似。

到此为止基本比较常xib动态布局基本上讲完了，但是我们应该还不够满意吧，毕竟用起来还挺复杂，而且一不小心就容易出错，很幸运的是有大神早已经封装好了一些第三方库。UITableView+FDTemplateLayoutCell这个库就可以很方便的处理cell高度的相关问题，他适用storyboard,xib和纯代码。我们可以用以下代码计算出相应的高度

return [tableView fd_heightForCellWithIdentifier:CELL_NAME3 configuration:^(TableViewCell3 * cell) {
    [cell setModel:self.dataArr[indexPath.row]];
}];

DEMO下载
这篇文字是我自己学习autolayout的一个笔记记录，在学习的过程中因为一直摒弃不了相对布局的思想，因此走了很多弯路，通过一些文字记录自己学习的过程，另外如果文章中有些不准确的地方，欢迎大家指出。