在TableView中加载来自Fiverr的图像

时间:2017-05-13 17:36:49

标签: ios swift firebase sdwebimage

您好我正在Xcode中使用swift进行应用程序。我正在从Firebase下载图像并在表格视图中显示它们。这有一些问题。但首先我会展示代码。

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的代码。 的问题

  1. 当我向下滚动然后再向上滚动时,相同单元格中的图像会有所不同。
  2. 桌面滚动非常滞后。
  3. 这些都是问题所在。请让我知道我该如何解决这个问题? 我知道库 SDWebImage ,但我不知道如何使用该库下载Firebase图像。请帮我解决这个问题。我对此问题非常疲惫。我一直在努力解决这个问题,过去20个小时没有睡觉,但却无法解决。请让我知道我做错了什么,我应该如何解决这个问题。感谢。

1 个答案:

答案 0 :(得分:2)

TableView是滞后的,因为你一直在重新加载图像。

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

但是,如果您要使用某些缓存框架,这两个问题都将得到解决,例如,最好的缓存框架可能是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