UITableView image changing while scrolling

Question

I have a UITableView with custom cell. Custom cell contains a UIView. The image loaded here asynchronously. But when scrolls my table view, the images in the cell changes. Here is my code:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"MyCell";
    MSAppointmentsModel *data = [self.appointments objectAtIndex:indexPath.row];

    MSAppointmentsCell *cell = (MSAppointmentsCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        NSArray *ar = [[NSBundle mainBundle] loadNibNamed:[Common checkDeviceforController:@"MSAppointmentsCell"] owner:nil options:nil];
        for (id eachObject in ar) {
            if ([eachObject isKindOfClass:[UITableViewCell class]]) {
                cell = eachObject;
            }
        }
        cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
        dispatch_async(dispatch_get_global_queue(0, 0), ^{
            NSURL *imgUrl = [NSURL URLWithString:[data.cusDetails objectForKey:@"customer_image"]];
            NSData *imgData = [NSData dataWithContentsOfURL:imgUrl];
            UIImage *image = [UIImage imageWithData:imgData];
            dispatch_sync(dispatch_get_main_queue(), ^{
                [cell.medallionView setImage:image];
            });
        });

        if (data.comp_status == YES) {
            cell.status.image = [Common imageResize:[UIImage imageNamed:@"CheckMark_green.png"] andResizeTo:cell.status.frame.size];
        }

    }

    cell.custName.text = [data.cusDetails objectForKey:@"customer_name"];
    cell.service.text = [data service];
    cell.empName.text = [NSString stringWithFormat:@"by %@",[data.empDetails objectForKey:@"employee_name"]];


    return cell;
}

Please help me.

Answer 1

Try this,

1: Take Array for caching image NSMutablearray * imageicons;

2: after downloading data add NULL values into array;

 imageicons=[[NSMutableArray alloc] init];

 for (int i=0; i<[self.appointments count]; i++) 
{
 [imageicons insertObject:[NSNull null] atIndex:i];
}

3:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
  if(indexPath.row < [imageicons count] && [imageicons objectAtIndex:indexPath.row] != [NSNull null] )
        {
            [cell.bookimage setImage:[imageicons objectAtIndex:indexPath.row]];
            NSLog(@"Array Hit");

        }
        else{
        NSLog(@"Count of %i Size of %li Array and row number %i",[imageicons count],sizeof(imageicons),indexPath.row);
      [NSThread detachNewThreadSelector:@selector(DownloadImageInBackground:) toTarget:self withObject:indexPath];
        }
 }

-(void)DownloadImageInBackground:(NSIndexPath *)path
{
MSAppointmentsModel *data = [self.appointments objectAtIndex:indexPath.row];
NSString *str=[data.cusDetails objectForKey:@"customer_image"];

  imagetodisplay  = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:str]]];

if (imagetodisplay==Nil)
{

  // set deault image
     [imageicons replaceObjectAtIndex:path.row withObject:[UIImage imageNamed:@"defaultimg.png"]];
}
else
{

    MSAppointmentsCell *cell=(MSAppointmentsCell *)[self.booktableview cellForRowAtIndexPath:path];
    [cell.bookimage setImage:imagetodisplay];
    //NSLog(@"Count of %i Size of %li Array and row number %i",[imageicons count],sizeof(imageicons),path.row);

    [imageicons replaceObjectAtIndex:path.row withObject:imagetodisplay];


}

}