UITableView 的單元格從好圖像閃爍到錯誤圖像並在滾動后修復

Question

我正在嘗試用我的 firestore 數據庫中的數據填充 UITableView 的 Cell。

由於某些原因，當我切換到包含我的表格視圖的應用程序選項卡時，我可以看到半秒鍾的好圖像，然后它閃爍到前面的單元格之一。

然后，如果我向下滾動並返回，好的圖像又回來了，但如果我向上和向下滾動到快速，錯誤的圖像會再次被調用。

要檢索我的數據並填充單元格，我這樣做：

在我的 class 文件中

檢索“主要項目” （這一項工作得很好）

• 主要物品的ID
• 子項 1 的 ID
• 子項 2 的 ID

檢索“子項”的詳細信息

• 子項目的ID
• 子項目的 IMG URL
• ...

該代碼還包括用於測試目的的“無用”代碼，以期找到解決方案..

    var groupNom:String = ""
    var groupStyles:String = ""
    var groupHeaderImg = [StorageReference]()
    var groupIconeImg = [StorageReference]()
    var videosArrayed = [String]()
    var groupIconeURL:String = ""

    func getGroupDetails(Did: String, completion: @escaping (_ message: String) -> Void) {

        let db = Firestore.firestore()
        let storage = Storage.storage()

        let docRef = db.collection("groups").document(Did)

        docRef.getDocument { (document, error) in
            if let document = document, document.exists {

                self.groupNom = document.get("nom") as! String
                self.groupStyles = document.get("styles") as! String
                let icone_img = document.get("icone_img") as! String

                self.groupIconeImg.removeAll()
                self.groupIconeImg.append(storage.reference(forURL: self.StorageRefRoot + "/groups/" + document.documentID + "/icones/" + icone_img + ".png"))
                //self.groupIconeURL.removeAll()
                self.groupIconeURL = self.StorageRefRoot + "/groups/" + document.documentID + "/icones/" + icone_img + ".png"
                //print("id: \(Did) array d'icone: \(self.groupIconeImg)")
                self.groupHeaderImg.append(storage.reference(forURL:"\(self.StorageRefRoot)/groups/\(Did)/headers/\(document.get("header_img") as! String).png"))

                let stylesNSArray = document.get("styles_ids") as! Array<Any>
                let stylesArrayed: [String] = stylesNSArray.compactMap({ $0 as? String })


                var tempGroupStyles = ""


                for i in stylesArrayed.indices {

                    let styleDocRef = db.collection("styles_groupes").document(stylesArrayed[i])
                    styleDocRef.getDocument { (document, error) in
                        if let document = document, document.exists {
                            //tempBarStyles = ""
                            if i < stylesArrayed.count-1 { // Si c'est le dernier element, on n'ajoute pas de virgule
                                tempGroupStyles = "\(tempGroupStyles)\(document.get("nom") as! String), "
                            } else {
                                tempGroupStyles = "\(tempGroupStyles)\(document.get("nom") as! String)"
                                //print("barstyles = \(tempGroupStyles)")

                            }

                            if i == stylesArrayed.count-1 {
                                self.groupStyles = tempGroupStyles
                            }

                        } else {
                            print("style to be decrypted do not exist")
                            return
                        }
                        completion("done")
                    }
                }

                let videosNSArray = document.get("videos_yt_ids") as! Array<Any>
                self.videosArrayed = videosNSArray.compactMap({ $0 as? String })



            } else {
                print("Groups details does not exist")
                return
            }
            completion("done")
        }

    }

在我的視圖控制器中

• 通過運行主要項目的 class 返回與主要項目一樣多的單元格（這個工作得很好）
• 對於每個主要項目，通過運行子項目的 class 檢索子項目 ID 的詳細信息

該代碼還包括用於測試目的的“無用”代碼，以期找到解決方案..

    var feedAbos = abo()
    var feedBars = bar()
    var feedGroupes = group()

    @IBOutlet weak var abosCollectionView: UICollectionView!
    @IBOutlet weak var aboFeedTableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()


    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated) // No need for semicolon

        if Auth.auth().currentUser != nil {
            //print("l'utilisateur en cours est: \(String(describing: Auth.auth().currentUser?.uid))")

            feedAbos = abo()
            feedAbos.getAbosFeed(uid: Auth.auth().currentUser!.uid, completion: { message in
                self.aboFeedTableView.reloadData()
            })
        } else {
            showLoginVC(viewToPresent: self, isModale: true)
        }



    }

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

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


        self.feedGroupes.getGroupDetails(Did: self.feedAbos.feedGroupesID[indexPath.row], completion: { message in
            if self.feedGroupes.groupIconeURL != "" {
                            cell.liveFeedGroupeImage.sd_setImage(with: URL(string: self.feedGroupes.groupIconeURL), placeholderImage: UIImage(named: "PLACEHOLDER1"))
            } else {
                cell.liveFeedGroupeImage.image = UIImage(named: "PLACEHOLDER1")
            }

            cell.liveFeedGroupeImage.layer.cornerRadius = 5
            cell.liveFeedGroupeNomLabel?.text = self.feedAbos.feedGroupesID[indexPath.row]

        })
        cell.liveFeedDateLabel?.text = self.feedAbos.feedLivesDates[indexPath.row]
        return cell
    }

class abosLivesFeedCell: UITableViewCell {

    @IBOutlet weak var liveFeedBarImage: UIImageView!
    @IBOutlet weak var liveFeedGroupeImage: UIImageView!
    @IBOutlet weak var liveFeedGroupeNomLabel: UILabel!
    @IBOutlet weak var liveFeedDateLabel: UILabel!
    @IBOutlet weak var liveFeedBarNomLabel: UILabel!

    override func prepareForReuse() {
        super.prepareForReuse()
        self.liveFeedGroupeImage.image = nil
    }
}

我認為這與我使用異步數據下載有關。 我在想，這可能與我處理完成 Firestore 類的方式有關……我還閱讀了有關調度方法的信息，但我從未使用過。

我很迷茫，因為這可能只是我不知道的事情，因為我絕對不是專業的編碼員:)

希望有人能指出我正確的方向或告訴我我在哪里犯了那個愚蠢且非常明顯的錯誤；D

謝謝大家 ！

Answer 1

好的，這就是我剛剛為使其工作所做的事情。 我不認為這是正確的方法，但它似乎工作......所以......

在我的 ViewController 中，我檢查主項目 class 中的子項目 ID 是否與從子項目 class 中檢索到的 ID 相同。 如果是這樣，我將子項目的 class 圖像加載到我的單元格中。

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView
            .dequeueReusableCell(withIdentifier: "abosLivesFeedCell", for: indexPath as IndexPath) as! abosLivesFeedCell
        cell.liveFeedGroupeImage.image = UIImage(named: "PLACEHOLDER1")

        self.feedGroupes.getGroupDetails(Did: self.feedAbos.feedGroupesID[indexPath.row], completion: { message in
            if self.feedGroupes.groupID == self.feedAbos.feedGroupesID[indexPath.row] {
                            cell.liveFeedGroupeImage.sd_setImage(with: URL(string: self.feedGroupes.groupIconeURL), placeholderImage: UIImage(named: "PLACEHOLDER1"))
            } else {

            }

            cell.liveFeedGroupeImage.layer.cornerRadius = 5
            cell.liveFeedGroupeNomLabel?.text = self.feedAbos.feedGroupesID[indexPath.row]

        })
        cell.liveFeedDateLabel?.text = self.feedAbos.feedLivesDates[indexPath.row]
        return cell
    }

希望有一天我能找到我錯的地方。 如果是這樣，我會更新答案！

感謝大家。