Swift - UITableView - Incorrect images load when scrolling fast

Question

I'm using the Haneke library to download, load & cache images. This works great, except when scrolling too fast, it loads the incorrect image, or sometimes no image at all.

It is scrolling faster than it can download in the background, so whatever image is next in the queue, can be loaded into the incorrect cell.

Here is the code for requesting the images over the network & from cache.

let fetcher_net = NetworkFetcher<UIImage>(URL: finished_URL!)
        let fetcher_disk = DiskFetcher<UIImage>(path: check_apost)
        cache.fetch(fetcher: fetcher_disk).onSuccess { image in
            //cell.card_imageIV.hnk_fetcher.cancelFetch()
            //print("Image Cache found")
            cell.card_imageIV.image = image
            }.onFailure{ image in
                //print("Unavailable to find image cache, fetching from network")
                cache.fetch(fetcher: fetcher_net).onSuccess { image in
                    //print("Network image request SUCCESS")
                    cell.card_imageIV.image = image
                }
        }

Also, in the custom cell Swift file, is there anything I can put in the following method that will stop any request when cells are off the screen?

override func prepareForReuse() {
    super.prepareForReuse()
    // Increment the generation when the cell is recycled

    //card_imageIV.hnk_cancelSetImage()
    //card_imageIV.image = nil
}

I've been trying to figure this out for weeks. If anyone has better libraries to use to fix this issue, let me know.

score 1 · Answer 1 · answered Jun 04 '16 at 16:57

What I do is store my images in a image cache like so.

      private var imageCache = [String:UIImage]()

Once I have fetched my image(s) from where ever, I store the UIImage in my imageCache array.

     self.imageCache["myImageFilename-01"] = img
     self.imageCache["myImageFilename-02"] = img2 
     etc....

Then I store the filename in my cell data obj.

 //Basic structure example.
 class myData: NSObject
    {
     var imageFilename : String?
     var titleText : Double?
     etc...
    }

Store the data in obj and store obj in array. This will be used later to fetch your data.

 let newObj = myData()
     newObj.imageFilename = "myImageFilename-01"
     newObj.titleText = "some title text"
  myDataArray.append(newObj)

Then you can set the image like so.

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCellWithIdentifier("TableCell", forIndexPath: indexPath) as! MyCustomCellClass

    //I like to clear the image. Just incase. Not sure it is needed to do.
     cell.myCellImage.image = nil //Or what ever you have wired up.

   //Get the data from your array of myDataArray
    let rowData  = myDataArray[indexPath.row]

    cell.myCellImage.image = self.imageCache[rowData.imageFilename]

   //Set the rest of your cell stuff

   return cell.
   }

That should get you going in the right direction. I think there might be some syntax issues, I wrote this on a computer without Xcode. Happy Coding.

Swift - UITableView - Incorrect images load when scrolling fast

1 Answers1