如何隱藏 tableview 直到圖像完全加載 iOS Swift？

Question

我的圖像在出現之前需要一秒鍾才能加載，這看起來很糟糕。 在 instagram 等應用程序上，tableview 是隱藏的，直到加載 tableview ......他們是怎么做到的？ 我有一個要顯示的加載器，但不知道何時停止它並顯示 tableview 並檢測圖像是否已首先完成加載？ 我應該把 stopTimer() 放在哪里？

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "MainTableViewCell",
                                                 for: indexPath) as! MainTableViewCell
    let payment = self.payments[indexPath.row]
    cell.profilePicture.layer.cornerRadius = cell.profilePicture.frame.size.width / 2
    cell.profilePicture.clipsToBounds = true

                if let profileImageUrl = payment.picture {
                    cell.profilePicture.loadImageUsingCacheWithUrlString(profileImageUrl)
                    }
                
    if payment.message == "none" {
        cell.detailsLabel.text = "No Message"
    } else {
        cell.detailsLabel.text = "\"\(payment.message ?? "")\""
    }
}

我在 TABLEVIEW 中獲取圖像的代碼：

let imageCache = NSCache<NSString, AnyObject>()

extension UIImageView {

func loadImageUsingCacheWithUrlString(_ urlString: String) {
    self.image = nil
    
    //check cache for image first
    if let cachedImage = imageCache.object(forKey: urlString as NSString) as? UIImage {
        self.image = cachedImage
        return
    }
    
    //otherwise fire off a new download
    guard let url = URL(string: urlString) else { return }
    URLSession.shared.dataTask(with: url, completionHandler: { (data, response, error) in
        
        //download hit an error so lets return out
        if let error = error {
            print(error)
            return
        }
        
        DispatchQueue.main.async(execute: {
            
            if let downloadedImage = UIImage(data: data!) {
                imageCache.setObject(downloadedImage, forKey: urlString as NSString)
                
                self.image = downloadedImage
            }
        })
        
    }).resume()
}
}

Answer 1

您可以簡單地將SDWebImage與 cocoaPods 一起使用，並將其用於支持緩存的異步圖像下載器。 在廣告 SDWebImage 之后，您的單元格將看起來像。

import SDWebImage


func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "MainTableViewCell",
                                             for: indexPath) as! MainTableViewCell
    let payment = self.payments[indexPath.row]
    cell.profilePicture.layer.cornerRadius = cell.profilePicture.frame.size.width / 2
    cell.profilePicture.clipsToBounds = true

    if let profileImageUrl = payment.picture {
        cell.profilePicture.sd_setImage(with: profileImageUrl, placeholderImage: UIImage(named: "yourPlaceholderImage.png"))
    }
            
    if payment.message == "none" {
    cell.detailsLabel.text = "No Message"
    } else {
    cell.detailsLabel.text = "\"\(payment.message ?? "")\""
    }
}

無需隱藏 tableView 即可下載圖片。