ios - 动态 TableViewCell 高度以适合下载的图像

Question

我正在关注这个答案:Using Auto Layout in UITableView for dynamic cell layouts & variable row heights但它缺少使我无法完成它的两件事:

1. 我在 Storyboard 原型(prototype)单元格中设置约束，而不是以编程方式设置
2. 图片下载是异步完成的。

基本上，我正在使用 SDWebImage 下载图像，并调整 UIImageView 的高度，以便它显示整个图像(当然是按比例缩小的)。我遇到的问题在下面的代码中进行了评论:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

   // dequeue cell using identifier

  [cell.pictureView sd_setImageWithUrl:myUrl completed:^( ... block ...) {

       // This code will scale down the UIImage to the UIImageView's width maitaining
       // its aspect ratio, and also will resize the UIImageView's to match the scaled-down UIImage's height

       if(image != nil) {
         CGSize imageSize = [image size];
         CGSize imageViewSize = CGSizeMake(280.0, 100.0);

         CGFloat correctHeight = (imageViewSize.width / imageSize.width) * imageSize.height;

         [[cell pictureView] setFrame:CGRectMake([[cell pictureView] frame].origin.x,
                                                  [[cell pictureView] frame].origin.y,
                                                  CGRectGetWidth([[cell pictureView] bounds]),
                                                  correctHeight)];

           // At this point, the subviews are all set. Since this happens async, what method do I call to re-calculate this row's height.

  }];


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

    static int defaultHeight = 230;

    // Get's the offscreen cell used only for calculation purposes
    WKZEventsCell *cell = [[self offscreenCells] objectForKey:CellIdentifier];
    if(!cell) {

        // HOW DO I GET A REFERENCE TO A PROTOTYPED CELL INSIDE THE STORYBOARD??? 
        // note that calling dequeueReusableCellWithIdentifier:CellIdentifier will cause a memory leak      

        cell = ??????
        [[self offscreenCells] setObject:cell forKey:CellIdentifier];
    }

    WKZEvent *event = [[self eventList] objectAtIndex:[indexPath row]];
    [[cell titleLabel] setText:[event title]];
    [[cell placeLabel] setText:[event title]];
    [[cell pictureView] setImage:image];


    // Even tho this should be in memory cache right now, I'm pretty sure this call is still asynchronous, so this might make the whole thing wont work.
    [cell.pictureView sd_setImageWithUrl:myUrl


    // THIS METHODS ARE COMMENTED BECAUSE MY CONSTRAINTS ARE SET IN STORYBOARD, BUT NOT SURE IF I'M RIGHT AT THIS ONE
    //[cell setNeedsUpdateConstraints];
    //[cell updateConstraintsIfNeeded];

    // I DONT HAVE A MULTILINE LABEL SO I DONT CALL THIS. NOT SURE ABOUT THIS ONE EITHER
    //cell.bounds = CGRectMake(0.0f, 0.0f, CGRectGetWidth(tableView.bounds), CGRectGetHeight(cell.bounds));

    [cell setNeedsLayout];
    [cell layoutIfNeeded];

    CGFloat height = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;

    height += 1;

    NSLog(@"%f", height);

    return height;
}

Answer 1

Storyboard:

• 向您的 TableView 添加一个新单元格
• 向单元格添加一个新的 ImageView
• 可选择为 ImageView 设置占位符图像
• 使单元格的约束明确地描述其高度

确保将单元格的行高设置为默认

代码:

让表格 View 自动调整单元格大小:

var tableview: UITableView {
    didSet {
        tableView.rowHeight = UITableViewAutomaticDimension
        tableView.estimatedRowHeight = 44
    }
}

在运行时，尽快开始异步加载图像。

下载完成后，加载图片到图片 View 并执行:

tableView.beginUpdates()
tableView.endUpdates()