iOS中使用AutoLayout动态调整Cell高度

之前做的不同高度的cell都是利用代码在HeightForRowAtIndexPath方法中计算cell高度来实现的,突然想用AL来实现一下动态Cell高度设置,先看看成果动图:

下面提供主要思路代码,类似数据填充的就不提了。

创建自定义Cell类ALTableViewCell并选择使用xib
之后创建约束
iOS中使用AutoLayout动态调整Cell高度_第1张图片

俩个Label都设置到leading/margin/topMargin为固定值,由于下面的content label 可能为多行文字,还要设置numberOfLine为0,并设置其高度约束为大于等于20,上面的titleLabel高度固定为20.

图片约束:首先要设置到周围距离为0的约束,并且图片的ContentMode一定要是Aspect Fit,这样图片才会以正确比例显示。

但这里有个问题, 最后图片的宽度一定就等于了屏幕(cell)的宽度,但高度却没有固定,所以cell的高度也是未知,直接导致了图片的位置,cell高度达不到要求,大家可以试试看看会有什么效果。
所以,这里我直接添加了一个图片高度约束,并outlet到cell中

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *imageHeightConstraint;

下面重写cell类中的setModel来实现传递model来更改UI的效果,并根据图片的高度来动态调整图片约束的高度,getImageRatio方法是为了获得获得了图片的宽高比:

- (void)setModel:(AKBModel *)model{
    _model = model;
    self.titleLabel.text = model.title;
    self.contentLabel.text = model.content;

    CGFloat width = [UIScreen mainScreen].bounds.size.width;   
    self.myImageView.image = [UIImage imageNamed:model.imageName];

    self.imageHeightConstraint.constant = width*[self getImageRatio];
}

- (CGFloat)getImageRatio{
    UIImageView *tempImageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:_model.imageName]];
    return (CGFloat)tempImageView.frame.size.height/tempImageView.frame.size.width;
}

到这里,自定义cell类里的内容就完成了,剩下的就回到控制器类继续设置:
先注册cell,告知重复利用的xib

    [self.tableView registerNib:[UINib nibWithNibName:@"ALTableViewCell" bundle:nil] forCellReuseIdentifier:cellID];

HeightForRowAtIndexPath这里不用管了,但有个estimatedHeightForRowAtIndexPath方法必须设置返回值,这个方法是返回一个估计的Cell高度,为了不复杂化,这里直接用了一个估计值200

    self.tableView.estimatedRowHeight = 200;

剩下的-就没了,直接运行就会发现cell高度等于文字+图片高度,比用纯代码真是省了不少计算功夫,但实际测试,涉及到一堆约束影响,效率的确不如使用代码高。

项目工程我传到了Github里面包含了纯代码实现动态cell高度和本篇利用AutoLayout的实现。
https://github.com/lucifron1994/DynamicCellHeight.git

你可能感兴趣的:(IOS开发)