Laden von Bildern von Firebase in TableViewCell Swift

Question

Ich versuche, Bilder aus meiner Firebase-Datenbank in meiner TableView-Zelle zu laden. Im mit AlamofireImage.

@IBOutlet weak var tableView: UITableView! 

var storiesArray = [Stories]() 

override func viewDidLoad() { 
    super.viewDidLoad() 

    retrieveStories() 
} 

Im immer die imageDownloadURL in dieser Funktion, die ich in viewDidLoad nennen()

func retrieveStories() { 

    let storiesDB = Database.database().reference().child("storyDetails") 

    storiesDB.observe(.childAdded) { (snapshot) in 

     let snapshotValue = snapshot.value as! Dictionary<String,String> 
     let autor = snapshotValue["autor"]! 
     let genre = snapshotValue["genre"]! 
     let titel = snapshotValue["titel"]! 
     let downloadURL = snapshotValue["imageDownloadURL"] 


     let story = Stories() 
     story.genre = genre 
     story.titel = titel 
     story.autor = autor 
     story.downloadURL = downloadURL 

     self.storiesArray.append(story) 

     DispatchQueue.main.async(execute: { 
      self.tableView.reloadData() 
     }) 

    } 
} 

Nachdem ich all diese Daten habe ich die Bilder von der url's herunterladen mag, die ich jetzt in storiesArray.downloadURL

im tun, dass in cellForRowAtIndexPath

let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! StoryDetailCell 

    if storiesArray[indexPath.row].downloadURL != nil { 
      Alamofire.request(indexPathRow.downloadURL!).responseImage { response in 
       debugPrint(response) 

       print(response.request as Any) 
       print(response.response as Any) 
       debugPrint(response.result) 

       if let image = response.result.value { 
        print("image downloaded: \(image)") 
        DispatchQueue.main.async { 
         cell.storyImage.image = image 
        } 

       } 
      } 
     } else if indexPathRow.downloadURL == nil { 
      cell.storyImage.image = #imageLiteral(resourceName: "standard") 
    } 

Die Bilder werden nur geladen, wenn die Zelle gerade angezeigt wird. Das verursacht viele Probleme. Ein Problem ist, dass wenn ich scrollte schneller als ein Bild lädt, wird es in einer anderen Zelle angezeigt.

Ich würde gerne wissen, wie man mit einer Situation wie dieser fertig wird.

Answer 1

let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! StoryDetailCell 

    cell.storyImage.image = nil 

    cell.tag += 1 
    let tag = cell.tag 

    if storiesArray[indexPath.row].downloadURL != nil { 
     Alamofire.request(indexPathRow.downloadURL!).responseImage { response in 

      if let image = response.result.value { 
       if cell.tag == tag { 
        DispatchQueue.main.async { 
         cell.storyImage.image = image 
        } 
       } 
      } 
     } 
    } else if indexPathRow.downloadURL == nil { 
     cell.storyImage.image = #imageLiteral(resourceName: "standard") 
    }