从服务器下载图像后动态制作tableview单元格高度

时间:2018-04-16 07:04:43

标签: ios swift uitableview uitableviewautomaticdimension

我有一个单元格,我现在从服务器上显示图像下载。现在我显示静态高度的图像,但现在我想像facebook和Instagram一样动态。例如,如果我上传图像320 * 100,那么我的手机需要变成300 * 100。如果需要,还建议服务器端更改 我正在使用afnetworking图像加载类。

这是我的手机设计。 enter image description here

修改 我试过给定解决方案,但现在问题是当第二次进入 cellforindexpath 方法时,单元格会使用加加速度调整大小。这将仅在第一个单元格中发生。

2 个答案:

答案 0 :(得分:1)

我完成了类似的任务,在桌子上显示图像并调整tableview单元格的大小,以便沿全屏宽度显示图像

IndexPath的行高

var cachedHeight = [IndexPath : CGFloat]()
    override func tableView(_ tableView: UITableView, heightForRowAtindexPath: IndexPath) -> CGFloat {

    let default_height : CGFloat = 332.0

    // lookup for cached height
    if let height = cachedHeight[indexPath]{
        return height
    }

    // no cached height found
    // so now try for image so that cached can be calculated and cached
    let cache : SDImageCache = SDImageCache.shared()
    let image : UIImage? = cache.imageFromDiskCache(forKey: self.viewModel?.getProductImage(of: indexPath.row, at: 0))

    if let image = image{
        let baseHeight : CGFloat = CGFloat(332 - 224)   // cell height - image view height
        let imageWidth = self.tableView.frame.size.width
        let imageHeight = image.size.height * imageWidth / image.size.width

        cachedHeight[indexPath] = imageHeight + baseHeight
        return cachedHeight[indexPath]!
    }

    //
    //  even if the image is not found, then
    //  return the default height
    //
    return default_height
}

IndexPath上的行的单元格

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    let sdCache = SDImageCache.shared()
    let cell = tableView.dequeueReusableCell(withIdentifier: "MyXYZCell", for: indexPath) as! AuctionListTableViewCell
    let imageURL = self.viewModel?.getProductImage(of: indexPath.row, at: 0)

    if let imageURL = imageURL {
        if (sdCache.imageFromCache(forKey: imageURL) != nil) {
            //
            //  image data already persist on disk,
            //  cell height update required
            //
            cell.auctionImageView.sd_setImage(with: URL.init(string: imageURL), completed: nil)
        }
        else
        {
            cell.auctionImageView.sd_setImage(with: URL.init(string: imageURL), completed: { (image, err, cacheType, url) in
                self.tableView.reloadRows(at: [indexPath], with: UITableViewRowAnimation.none)
            })
        }
    }

    //other cell customization code

    return cell
}

我使用过SDWebImage。您可以使用它,或在AFNetworking中找到类似的api。

主题演讲:

  1. 此处cachedHeight用于缓存由IndexPath索引的单元格的高度,因为从磁盘读取图像是安静的I / O穷举任务,这导致表格视图滚动滞后
  2. heightForRow我检查过,图像是否在缓存中,如果在缓存中,则计算高度,将其存储到cachedHeight中,否则返回默认高度。 (我的占位符图像的默认高度是计算的)
  3. 在我已检查过的cellForRowAtIndexPath中,图片位于缓存中。如果图像在缓存中,则不需要重新加载,因为已经计算了高度。否则我尝试网络提取,当提取完成时我请求tableview重新加载该单元格。
  4. 希望它有所帮助,快乐编码。

答案 1 :(得分:1)

我已经解决了这个问题。 如果必须使imageview高度和宽度动态,请要求服务器在API响应中发送图像宽度和高度。 一旦两者兼顾,根据图像宽度和屏幕宽度计算图像高度。 约束图像高度。并将计算出的高度分配给图像高度约束。

要计算图像高度,请使用以下公式: -

imageHeight =  (screen_width * actual_image_height) / actual_image_width