Images are changing in collectionView when i scroll it

Question

n the code below, the collectionView will scroll smoothly, but sometimes if I scroll extremely fast, there will be an incorrect image that shows and then changes to the correct one as the scrolling decelerates. Why isn't setting the Below is the code which I am using My code :

  - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
    {

        UICollectionViewCell *cell;
        cell= [collectionView dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];

        cell.backgroundColor = [UIColor whiteColor];

        NSMutableArray *arr_assect=[menuArray objectAtIndex:indexPath.row];

        backView=[[UIView alloc]initWithFrame:CGRectMake(0, 0, cell.bounds.size.width, cell.bounds.size.height)];


        UIImageView *dotlines=[[UIImageView alloc]init];
        dotlines.frame=CGRectMake(1, 0, cell.bounds.size.width-1, cell.bounds.size.height);
        dotlines.image=[UIImage imageNamed:@"dottedline"];
        [cell addSubview:dotlines];

                UIImageView*cellImage=[[UIImageView alloc]initWithFrame:CGRectMake(18, 10,backView.bounds.size.height-35, backView.bounds.size.height-40)];


        NSLog(@"arrayimage%@",[[menuArray valueForKey:@"category_image"] objectAtIndex:indexPath.row]);




        NSString *str_homepage = [NSString stringWithFormat:@"%@",[[menuArray valueForKey:@"home_page"] objectAtIndex:indexPath.row]];


        NSLog(@"str_home_page%@",str_homepage);


        NSString   *imageUrl= [arr_assect valueForKey:@"category_image"];



        if ([[ImageCache sharedImageCache] DoesExist:imageUrl]) {

            cellImage.image=[UIImage imageWithData:[[ImageCache sharedImageCache] GetImage:imageUrl]];
        }
        else{


            dispatch_queue_t queue=dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);

            dispatch_async(queue, ^{

                NSData *imageData=[NSData dataWithContentsOfURL:[NSURL URLWithString:imageUrl]];

                dispatch_async(dispatch_get_main_queue(), ^{
                    cellImage.image=[UIImage imageWithData:imageData];



                });
                [[ImageCache sharedImageCache] AddImage:imageUrl withData:imageData];


            });
        }

        UILabel *lblCategoryTitle =(UILabel *) [cell viewWithTag:5];

        if (!lblCategoryTitle) {

            lblCategoryTitle=[[UILabel alloc]init];

            [cell.contentView addSubview:lblCategoryTitle];
        }

        [lblCategoryTitle  setFont: [UIFont fontWithName:@"helvetica" size:10]];

        lblCategoryTitle.tag=5;

        lblCategoryTitle.textAlignment = NSTextAlignmentCenter;

        lblCategoryTitle.frame=CGRectMake(backView.frame.origin.x, cellImage.frame.origin.y+cellImage.frame.size.height+0,cell.frame.size.width , 25);

        lblCategoryTitle.textColor = [UIColor blackColor];

        lblCategoryTitle.backgroundColor = [UIColor clearColor];

        lblCategoryTitle.numberOfLines = 2;




        NSString *abc = [arr_assect valueForKey:@"categoryNm"];


        abc = [NSString stringWithFormat:@"%@%@",[[abc substringToIndex:1] uppercaseString],[abc substringFromIndex:1] ];
        NSLog(@"abc = %@",abc);


        if (APP_SHARE.language_int == 0) {
            lblCategoryTitle.text =abc;
        }
        else if (APP_SHARE.language_int == 2)
        {
            lblCategoryTitle.text =[arr_assect valueForKey:@"categoryNmBl"];
        }

        [cell addSubview:cellImage];
        [cell.contentView addSubview:backView];
        return cell;

    }

Answer 1

In order to fix this issue you should prepare your cell to be reused. There is a method called prepareForReuse on UICollectionViewCell and UITableViewCell. If you do not clean content before cell is reused, then you might see content from the previous cell.

It does not affect if you use only labels/textviews and your content is ready to be setup. However, if you use background image loading (as in your example) or any other background tasks, then it will definitely affect you.

Here is an example of implementation:

- (void)prepareForReuse {
    _titleLabel.text = nil;
    _avatarImageView.image = nil;

    [super prepareForReuse];
}