reloading UItableViewCell after thumbnail image downloads - ios

Question

I have an app in which within the tableViewCell an image is downloaded and than set as a thumbnail. My problem is that the only way I can see the thumbnail image refresh is if I click on another tab, and than come back to the tab that the tableViewCell is being held. Below is the code for setting the thumbnail.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier forIndexPath:indexPath];
PFObject *message = [self.messages objectAtIndex:indexPath.row];
cell.textLabel.text = [message objectForKey:#"username"];
cell.imageView.image = [UIImage imageNamed:#"Treehouse.png"];
PFFile *thumbnail = nil;
if (thumbnailArray.count > 0){
thumbnail = [[thumbnailArray objectAtIndex:indexPath.row] objectForKey:#"imageFile"];
dispatch_async(backgroundQueue, ^{
NSURL *thumbnailURL = [[NSURL alloc]initWithString:thumbnail.url];
NSData *thumbnailData = [NSData dataWithContentsOfURL:thumbnailURL];
[[cell imageView]setImage:[UIImage imageWithData:thumbnailData]];
[tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationNone];
});
}
return cell;
}

Answer 1

The problem is.,
The cell is loaded.
The image download is fired.
Once image is downloaded, the cell is reloaded.
The image is downloaded again.
There is no caching of the image or logic to load the image
Declare a NSMutableDictionary #property (strong) NSMutableDictionary *imagesDictionary; and instantiate it self.imagesDictionary = [NSMutableDictionary dictionary];
In cell for Row at index path, check for the presence of cache before downloading it.
PFFile *thumbnail = nil;
if (thumbnailArray.count > 0)
{
//If image is present in cache load from cache
UIImage *image = [self.imagesDictionary objectForKey:indexPath];
if (image)
{
[cell.imageView setImage:image];
}
else
{
//If Image is not present fire a download
thumbnail = [[thumbnailArray objectAtIndex:indexPath.row] objectForKey:#"imageFile"];
dispatch_async(backgroundQueue, ^{
NSURL *thumbnailURL = [[NSURL alloc]initWithString:thumbnail.url];
NSData *thumbnailData = [NSData dataWithContentsOfURL:thumbnailURL];
//Cahce it to your image dictionary
[self.imagesDictionary setObject:[UIImage imageWithData:thumbnailData] forKey:indexPath];
//Reload the dictionary
[tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationNone];
});
}

Answer 2

I recommend you use AFNetworkings category UIImage+AFNetworking which allows you to just do [imageView setImageWithURL:(NSURL)] which manages everything in the background. You don't have to worry about loading the image, caching the image or anything like that. It will cache it for you.
https://github.com/AFNetworking/AFNetworking

Answer 3

The following code helped solve my problem
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier forIndexPath:indexPath];
PFObject *message = [self.messages objectAtIndex:indexPath.row];
cell.textLabel.text = [message objectForKey:#"username"];
cell.imageView.image = [UIImage imageNamed:#"Treehouse.png"];
PFFile *thumbnail = nil;
if (thumbnailArray.count > 0){
thumbnail = [[thumbnailArray objectAtIndex:indexPath.row] objectForKey:#"imageFile"];
dispatch_async(backgroundQueue, ^{
NSURL *thumbnailURL = [[NSURL alloc]initWithString:thumbnail.url];
NSData *thumbnailData = [NSData dataWithContentsOfURL:thumbnailURL];
dispatch_sync(dispatch_get_main_queue(), ^{
[[cell imageView]setImage:[UIImage imageWithData:thumbnailData]];
[tableView reloadInputViews];
});
});
}
return cell;
}
The problem was that reloading the TableView was being called on a separate thread. Once I moved the setting of the image onto the main thread and calling reloadInputViews from there, my problem was fixed.