更新图像后重新加载表格单元格的问题

Question

我在我的应用程序中使用 Firestore 和 Firebase 存储。 我遇到了问题，我正在下载单元格内容，然后下载图像并将它们插入行中。 但是，除非您单击一行，否则图像不会显示，强制刷新。 下载图片后如何自动重新加载内容？ 我尝试使用下面的代码片段，但它冻结了应用程序并导致 CPU 利用率最大化。 所以我不确定我是否把它放在了错误的位置，或者我是否应该使用不同的技术。

DispatchQueue.main.async {
     self.inventoryTableView.reloadData()
}

以下是我的应用程序如何工作的过程的概述：

1. 调用“downloadAssetList”并下载表格内容，其中包括用于下载正确图像的 URL。
2. 调用“setInventoryCell”下载图像并将其分配给单元格中的 UIImageView

下面是一张希望能更好地显示问题的图片。

InventoryViewController.swift

//
//  InventoryViewController.swift
//  ItemizePro
//
//  Created by Tyler Wasick on 5/18/20.
//  Copyright © 2020 Tyler Wasick. All rights reserved.
//

import UIKit

class InventoryViewController: UIViewController {
    
    @IBOutlet weak var inventoryTableView: UITableView!
    
    var assetList = [Asset]()
    
    override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.
        // Configure the tableview delegate and data source
        inventoryTableView.delegate = self
        inventoryTableView.dataSource = self
        
        // Download asset list
        FirebaseDB.downloadAssetList { (list) in
            self.assetList = list
            self.inventoryTableView.reloadData()
        }
    }
    
    override func viewWillAppear(_ animated: Bool) {
        
    }
    
    // MARK: - Functions
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        print(indexPath)
    }

}

extension InventoryViewController: UITableViewDelegate, UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        print(assetList.count)
        return assetList.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        // Format date field
        let formatter = DateFormatter()
        formatter.dateStyle = .medium
        formatter.timeStyle = .none
                
        // Set the cell with asset data
        let cell = tableView.dequeueReusableCell(withIdentifier: Constants.Storyboards.TableViewCell.inventoryCellID) as! InventoryListView
        
        // Get the asset for that rown
        let cellAsset = assetList[indexPath.row]
        
        // Set the cell details
        cell.setInventoryCell(cellAsset)

        // Return the row
        return cell
    }
}

InventoryListView.swift

//
//  InventoryListView.swift
//  ItemizePro
//
//  Created by Tyler Wasick on 7/20/20.
//  Copyright © 2020 Tyler Wasick. All rights reserved.
//

import UIKit
import FirebaseStorage

class InventoryListView: UITableViewCell {
    
    @IBOutlet weak var assetImageView: UIImageView!
    
    @IBOutlet weak var itemLabel: UILabel!
    
    @IBOutlet weak var itemText: UILabel!
    
    @IBOutlet weak var roomLabel: UILabel!
    
    @IBOutlet weak var roomText: UILabel!
    
    @IBOutlet weak var purchasedLabel: UILabel!
    
    @IBOutlet weak var purchasedText: UILabel!
    
    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
    }
    
    // Print inventory cell
    func setInventoryCell(_ inventoryAsset:Asset) {
        
        // TODO: Break this out into its own function that uses a trailing closure¥
        // Download an image
        if inventoryAsset.assetImageURL?.trimmingCharacters(in: .whitespacesAndNewlines) != "" || inventoryAsset.assetImageURL != nil {
            
            // Create a reference to the storage service
            let storage = Storage.storage()
            
            // Create a reference to the storage service
            let pathRef = storage.reference(forURL: inventoryAsset.assetImageURL!)
            
            // Download the URL data
            pathRef.getData(maxSize: 1 * 1024 * 1024) { (data, err) in
                
                // Check to see if an error has occured
                if let err = err {
                    
                    // An error has occured
                    print(err)
                } else {
                    
                    // Download image data
                    let assetImage = UIImage(data: data!)
                    
                    // Assign image to asset
                    inventoryAsset.assetImage = assetImage
                    
                    // Set the asset image
                    if let image = inventoryAsset.assetImage {
                        self.imageView?.image = image
                    }
                }
            }
            //closure()
        }
        
        // Set date to be displayed
        let formatter = DateFormatter()
        formatter.dateFormat = "MM-yyyy"
        
        // Set prototype cell fields
        // Set "asset" label
        if let name = inventoryAsset.name {
            itemText.text = name
        } else {
            itemText.text = ""
        }
        
        // Set "room" label
        if let room = inventoryAsset.room {
            roomText.text = room
        } else {
            roomText.text = ""
        }
        
        // Set "purchased" label
        if let date = inventoryAsset.datePurchased {
            purchasedText.text = formatter.string(from: date)
        }
        
    }
    
}

Answer 1

我还在使用 firebase 存储，我正在使用 Kingfisher 下载和缓存图像。 强烈建议你也试试。 这是我的做法：

let imageRef = Storage.storage().child("path/to/resource")
imageRef.downloadURL { url, error in
    guard let downloadedURL = url else {
        // handle error
        return
    }

    imageView.kf.setImage(with: downloadedURL)
}

Answer 2

由于您使用的是 fire base，为什么不使用 fire base UI，它为您提供了名为 SDWebImage 的 package，它为您提供了多个选项，例如渐进式加载和高优先级加载，以及使用闭包的各种选项。 实现也是一行，以URL为参数。 https://github.com/firebase/FirebaseUI-iOS

它提供本机缓存。 所以也没有更多的行来设置缓存。 一条线解决一切

Answer 3

表格单元格上的图像显示可能很棘手，因为单元格被重复使用，而且有时图像尺寸可能太大，因此它们可能需要一些时间来下载，我建议使用 SDWebImage，它可以更优雅地处理图像下载。

链接： https://github.com/SDWebImage/SDWebImage