高度 UIImage 在具有自动布局的 UITableview 中异步

Question

我在 UITableView 中显示图像，图像将具有不同的大小，并通过 JSON 下载，以下代码显示图像正确缩放，但上下有一些大空间（绿色）。我怎样才能消除这些空格？

图像的上下左右约束为 0，以便能够使用自动布局

import UIKit

class ViewController: UIViewController, UITableViewDataSource {

    struct JsonSosTalleres : Codable {
        let titulo : String
        let image : String
    }

    private var datosOfertas = [JsonSosTalleres]()

    class ImageLoader {

        var cache = NSCache<AnyObject, AnyObject>()

        class var sharedInstance : ImageLoader {
            struct Static {
                static let instance : ImageLoader = ImageLoader()
            }
            return Static.instance
        }

        func imageForUrl(urlString: String, completionHandler:@escaping (_ image: UIImage?, _ url: String) -> ()) {
            let data: NSData? = self.cache.object(forKey: urlString as AnyObject) as? NSData

            if let imageData = data {
                let image = UIImage(data: imageData as Data)
                DispatchQueue.main.async {
                    completionHandler(image, urlString)
                }
                return
            }

            let downloadTask: URLSessionDataTask = URLSession.shared.dataTask(with: URL.init(string: urlString)!) { (data, response, error) in
                if error == nil {
                    if data != nil {
                        let image = UIImage.init(data: data!)
                        self.cache.setObject(data! as AnyObject, forKey: urlString as AnyObject)
                        DispatchQueue.main.async {
                            completionHandler(image, urlString)
                        }
                    }
                } else {
                    completionHandler(nil, urlString)
                }
            }
            downloadTask.resume()
        }
    }



    @IBOutlet weak var tabla: UITableView!
    override func viewDidLoad() {
        super.viewDidLoad()

        downloadJson()


        tabla.estimatedRowHeight = 40.0

        tabla.rowHeight = UITableViewAutomaticDimension

        tabla.tableFooterView = UIView()

    }








    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return datosOfertas.count
    }


    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tabla.dequeueReusableCell(withIdentifier: "ofertacell") as? TableViewCell else { return UITableViewCell() }


        let fimage = datosOfertas[indexPath.row].image
        ImageLoader.sharedInstance.imageForUrl(urlString: fimage, completionHandler: { (image, url) in
            if image != nil {


               tableView.beginUpdates()

                cell.imagen.image = image

                tableView.endUpdates()


            }
        })



        return cell
    }




    // download  json
    let url = URL(string: "http://sostalleres.com/test.json")

    func downloadJson() {
        guard let downloadURL = url else { return }
        URLSession.shared.dataTask(with: downloadURL) { data, urlResponse, error in
            guard let data = data, error == nil, urlResponse != nil else {
                print("something is wrong")
                return
            }
            print("downloaded")
            do
            {
                let decoder = JSONDecoder()
                self.datosOfertas = [try decoder.decode(JsonSosTalleres.self, from: data)]

                DispatchQueue.main.async {

                            self.tabla.reloadData()

                }

            } catch {
                print("something wrong after downloaded")
            }
            }.resume()
    }





}

在 TableViewCell.swift 中：

class TableViewCell: UITableViewCell {

    @IBOutlet weak var imagen: UIImageView!



    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }

}

View image

如果您能指导我解决任何问题，我将不胜感激。

Answer 1

您必须计算新的高度和宽度，并使用它们应用比例并使用tableView.beginUpdates() 和tableView.endUpdates()，使用以下代码应该可以正常工作。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tabla.dequeueReusableCell(withIdentifier: "ofertacell") as? TableViewCell else { return UITableViewCell() }


        let fimage = datosOfertas[indexPath.row].image
        ImageLoader.sharedInstance.imageForUrl(urlString: encoded!, completionHandler: { (image, url) in
            if image != nil {


                let newWidth = self.self.imagenDetalle.frame.width
                let scale = newWidth/(image?.size.width)!
                let newHeight = (image?.size.height)! * scale



                        tableView.beginUpdates()

                        UIGraphicsBeginImageContext(CGSize(width:newWidth, height:newHeight))
                        image?.draw(in: CGRect(x:0, y:0, width:newWidth, height:newHeight))
                        let newImage = UIGraphicsGetImageFromCurrentImageContext()
                        UIGraphicsEndImageContext()
                        cell.imagen.image = newImage

                        tableView.endUpdates()


            }
        })



        return cell
    }

编码愉快！

Answer 2

我建议设置高度和宽度限制并创建相应的插座：

@IBOutlet private weak var heightConstraint: NSLayoutConstraint!
@IBOutlet private weak var widthConstraint: NSLayoutConstraint!

您可以在同一个单元格上创建一个图像属性，该属性使用大小来设置图像视图大小和图像：

internal var image: UIImage? {
    willSet {
        imageView.image = newValue
        guard let image = newValue else { return }
        heightConstraint.constant = image.size.height
        widthConstraint.constant = image.size.width
    }
}

这（可能是错误的）假设每个图像都是完美的尺寸。如果不是这种情况，您将需要自己进行一些缩放。