UITableViewCell加载网络图片自适应cell高度初探索

cell上控件在请求网络图片的时候,通常会返回图片的宽高比;在项目中碰到需要按照比例来显示图片的问题,如果只有图片一个控件按照宽高比直接设置frame即可,但是如果cell上有很多的控件,自适应高度是比较复杂的.

我们知道在AutoLayout中只要不设置UILabel的高度是可以让其自适应文本高度的,那么UIImageView可不可以也自适应高度呢.

UILabel之所以能够自适应高度,肯定也是在cell显示之前,系统通过UILabel的约束条件/字体大小和显示的文本内容计算出来的;因此只要我们在cell显示之前将UIImageView的各个约束设置好就可以实现UIImageView在cell上自适应高度

NSDictionary *attributes = [NSDictionary dictionaryWithObjectsAndKeys:[UIFont systemFontOfSize:字体大小],NSFontAttributeName, nil];
[显示的文本 boundingRectWithSize:CGSizeMake(UILabel宽度, CGFLOAT_MAX) options:NSStringDrawingUsesLineFragmentOrigin attributes:attributes context:nil];

(此处只说明固定了图片宽度的情况,其余各种情况可以更改更改相应的约束实现)

1. 我们先在cell的xib中拖入一个UIImageView,对其约束好距离左边,右边,上边的距离(当然如果你想全部用代码写约束也行......)

2. 然后我们给tableview设置两个属性,让cell的行高自适应控件的高度

// 设置行高为自动
self.tableView.rowHeight = UITableViewAutomaticDimension;
// default is 0, which means there is no estimate
// 官方解释不为0即可
self.tableView.estimatedRowHeight = 10;

3. 在cell的类中,我们设置一个属性(用处是在返回cell的时候给其赋值请求到的网络图片宽高比)

/** 显示图片 */
@property (weak, nonatomic) IBOutlet UIImageView *iamgeV;
/** 比例约束 */
@property (weak, nonatomic) NSLayoutConstraint *ratioLC;
/** 赋值比例 */
@property (nonatomic, assign) CGFloat ratio;

4. 在返回cell的代理方法里面,对比例进行赋值,通过setRatio方法实现如下:

- (void)setRatio:(CGFloat)ratio {
// "view1.attr1 = view2.attr2 * multiplier + constant"
_ratioLC = [NSLayoutConstraint constraintWithItem:_iamgeV attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:_iamgeV attribute:NSLayoutAttributeWidth multiplier:ratio constant:0];
[_iamgeV addConstraint:_ratioLC];
}

5. 运行一下即可看到图片比例不失真,当然其余控件均可以这样实现约束.....