在 TableView 中从 Fiverr 加载图像

Question

您好，我正在 Xcode 申请并使用 swift。我正在从 Firebase 下载图像并在 table 视图中显示它们。这有一些问题。但首先我会展示代码。

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "customCell", for: indexPath) as! FrontViewCell

    cell.contentView.backgroundColor = UIColor.clear

    //let whiteRoundedView : UIView = UIView(frame: CGRect(10, 8, self.view.frame.size.width - 20, 149))
    let whiteRoundedView: UIView = UIView(frame: CGRect(x: 10, y: 8, width: self.view.frame.width - 20, height: 200))
    whiteRoundedView.layer.backgroundColor = CGColor(colorSpace: CGColorSpaceCreateDeviceRGB(), components: [1.0, 1.0, 1.0, 0.8])
    whiteRoundedView.layer.masksToBounds = false
    whiteRoundedView.layer.cornerRadius = 2.0
    whiteRoundedView.layer.shadowOffset = CGSize(width: -1, height: 1)
    whiteRoundedView.layer.shadowOpacity = 0.2

    cell.contentView.addSubview(whiteRoundedView)
    cell.contentView.sendSubview(toBack: whiteRoundedView)

    //cell.categoryImageView.image = catImages[indexPath.row]
    //print("Product \(allCats[indexPath.row].name)")

    cell.categoryLabel.text = allCats[indexPath.row].name

    if let n = allCats[indexPath.row].name{
        con?.storage?.reference(withPath: "categories/\(n).png").data(withMaxSize: 10 * 1024 * 1024, completion: {
            data, error in
            if error == nil{
                let im = UIImage(data: data!)
                cell.categoryImageView.image = im
                cell.layoutSubviews()
            }
            else{
                print("Error Downloading Image \(error?.localizedDescription)")
            }
        })
    }
    return cell
}

以上是将图像设置到单元格中的 imageView 的代码。问题

当我向下滚动然后再次向上滚动时，相同单元格中的图像不同。
table视图滚动非常缓慢。

就是这些问题。请让我知道我该如何解决这个问题？我知道一个库 SDWebImage 但我不知道如何使用该库下载 Firebase 图像。请帮我解决这个问题。我被这个问题搞得筋疲力尽。在过去的 20 个小时里，我一直在不眠不休地尝试解决它，但没有成功。请让我知道我做错了什么以及我应该如何解决。谢谢

Answer 1

TableView 很慢，因为您一直在重新下载图像。

这是一个缓存问题。至于同一单元格中的图像不同，您可以通过将图像重新设置为零来更改它，因为单元格正在重复使用，它们使用的是以前的图像，而下载新图像。

但是如果您使用某种缓存框架，这两个问题都会得到解决，例如，可能最好的框架是 SDWebImage。

如果您不想为此使用图书馆。下面是缓存图片最基本的实现。

let imageCache = NSCache<AnyObject, AnyObject>()

extension UIImageView {

    func loadImageUsingCacheWithUrlString(_ urlString: String) {

        self.image = nil

        //check cache for image
        if let cachedImage = imageCache.object(forKey: urlString as AnyObject) as? UIImage {
            self.image = cachedImage
            return
        }

        //otherwise start the download
        let url = URL(string: urlString)
        URLSession.shared.dataTask(with: url!, completionHandler: { (data, response, error) in

            //there was an error with the download
            if error != nil {
                print(error ?? "")
                return
            }

            DispatchQueue.main.async(execute: {

                if let downloadedImage = UIImage(data: data!) {
                    imageCache.setObject(downloadedImage, forKey: urlString as AnyObject)

                    self.image = downloadedImage
                }
            })

        }).resume()
    }

}

用法：

cell.categoryImageView.loadImageUsingCacheWithUrlString("your firebase url string")

编辑：是的，您可以使用它来下载存储在 Firebase 中的图像。

编辑：此代码将解决您的问题，但此处未考虑内存管理，对于严肃的生产应用程序，我建议查看专用于图像缓存的库。

编辑：我刚刚注意到 Firebase 文档中有适当的信息，显示了它如何与 SDWebImage 一起工作。检查一下：SDWebImage + Firebase

在 TableView 中从 Fiverr 加载图像

Load Images From Fiverr in TableView

ios

swift

firebase

sdwebimage