UICollectionView with NINetworkImageViews repeats images

Question

I'm using NINetworkImageView from Nimbuskit. I have a simple UICollectionView showing a grid of images (NINetworkImageViews). Normally it works like a charm, but in certain situations some of the NINetworkImageViews show a wrong image.

I think it happens when there is no path for the image and NINetworkImageView has to show the default image. Sometimes (few times) instead of showing the default image, it appears other image belonging to other NINetworkImageView of the CollectionView.

Here is the related code:

- (UICollectionViewCell*) collectionView:(UICollectionView *)collectionView   cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *cellIdentifier = @"ShelvingCell";
    ShelvingCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];

    // Prueba para ver si esto arregla lo de que se repitan imágenes
    [cell.feedNetworkImageView prepareForReuse];

    cell.feedNetworkImageView.delegate = self;

    // El collage necesita un tratamiento especial
    if (indexPath.section == 0 && indexPath.row == 0)
    {
        cell.feedTitleLabel.text = @"";
        cell.lastFeedNewTitleLabel.text = @"";
        // Prueba para ver si esto arregla lo de que se repitan imágenes
        [cell.feedNetworkImageView setPathToNetworkImage:@""];

        // Prueba para ver si esto arregla lo de que se repitan imágenes
        [cell.feedNetworkImageView prepareForReuse];

        cell.feedNetworkImageView.image = [UIImage imageNamed:@"collage.png"];
    }
    else
    {    
        MOFeed *feed = [self.feeds objectAtIndex:(indexPath.section*3 + indexPath.row - 1)];
        cell.feedTitleLabel.text = feed.title;

        // Recuperamos la última noticia del feed
        MONoticia *ultimaNoticia = [feed lastFeedNew];

        cell.lastFeedNewTitleLabel.text = ultimaNoticia.title;

        if (![feed.feedImageURL isEqualToString:@""] && feed.feedImageURL)
        {
            // Prueba para ver si esto arregla lo de que se repitan imágenes
            [cell.feedNetworkImageView prepareForReuse];
            [cell.feedNetworkImageView setPathToNetworkImage:feed.feedImageURL];
        }
        else
        {
            // Prueba para ver si esto arregla lo de que se repitan imágenes
            [cell.feedNetworkImageView prepareForReuse];

            cell.feedNetworkImageView.image = [UIImage imageNamed:@"shelvingcell.png"];
            // Prueba para ver si esto arregla lo de que se repitan imágenes
            [cell.feedNetworkImageView setPathToNetworkImage:@""];
        }
    }
    return cell;
}

Thanks a lot!

Carlos

Refer: http://stackoverflow.com/questions/14204204/update-uiprogressview-in-uicollectionviewcell-for-download-file/14301380#14301380 — LE SANG, Jan 21 '13 at 18:22
Thanks Sang! I've already created a custom cell and it is initialized through storyboard. And setPathToNetworkImage is a custom setter... So I'm not sure this is the problem... — Carlos, Jan 21 '13 at 18:45
Hi,if still not solve, please send me a simple example about NINetworkImageView(display in UIImageView only). I had met this problem before and solve it but with SDWebImage: http://www.mediafire.com/?96bhqh9j1njsl7l — LE SANG, Jan 22 '13 at 04:43

score 1 · Answer 1 · answered Mar 30 '13 at 23:38

I had the same problem, and when i dig into the issue, it looks like

[cell.feedNetworkImageView prepareForReuse];

didn't cancel all download operation. you have to do a little hack

before call

[cell.feedNetworkImageView setPathToNetworkImage:feed.feedImageURL];

cancel all network operation operation and then create a new network operation

[self.displayImage.networkOperationQueue cancelAllOperations];
self.displayImage.networkOperationQueue = [[NSOperationQueue alloc]init];
[cell.feedNetworkImageView setPathToNetworkImage:feed.feedImageURL];

it's not as efficient since you each image download need it's own operation queue so it can be cancelled. this may need a little bit more work to make it more efficient. but so far it looks like there is no repeated images

Thanks Charlie! I will give a try to your solution in a couple of weeks — Carlos, Apr 05 '13 at 11:53

score 0 · Answer 2 · answered Jan 22 '13 at 00:12

0

Carlos, I don't know much about NINetworkImageView, but my theory is that UICollectionView is reusing your views, and you don't cancel the request. Say you load the first cell, and then a request is being triggered for that image. Then you start scrolling. That first cell is reused before the first request finishes, and probably this new item reusing that cell does not have an image, so you don't call setPathNetwork... The result, the new reused cell will have the first cell image.

Probably there is a method in NINetworkImageView to cancel the request. Call it everytime you reuse one of these views.

Un saludo!

answered Jan 22 '13 at 00:12

LocoMike

5,626
5
30
43

Thanks LocoMike! I think the problem is something as you say. But, I'm calling [cell.feedNetworkImageView prepareForReuse] that do the following: "Kill any network requests and replace the displayed image with the initial image. Prepares this view for reuse by cancelling any existing requests and displaying the initial image again" – Carlos Jan 22 '13 at 18:02
Well, I don't know the internals of NINetworkImageView, but you could debug and set a breakpoint in setImage to see if a request that has been cancelled is trying to set an image. Sorry I can't help more, but there are too many libraries for async image loading and simply don't feel like diving into another one :) – LocoMike Jan 22 '13 at 18:45

UICollectionView with NINetworkImageViews repeats images

2 Answers2