How to add a dissolve animation with SDWebImage with a UICollectionView

Question

I want to add some animation to the imageView with the SDWebImage.and my collectionView delegate function is here

- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath
{    
    Cell *cell = (Cell *)[cv dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];
        
    [cell.imageView sd_setImageWithURL:[NSURL URLWithString:URL] completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {   
        cell.imageView.alpha = 0;
        [UIView animateWithDuration:0.5 animations:^{
            cell.imageView.alpha = 1;
        }];    
    }];
}

It's OK during the SDWebImage download the image and set the image of the imageView. But when I call the [collection reloadData] method,these imageViews dissolve again.

I know the reason but I do not have a solution of it.

score 1 · Accepted Answer · edited May 23 '17 at 12:30

I've been struggling with the same issue lately and I think I've came up with an easy to use solution. You can see it here.

Basically it's a UIImageView category that uses animation to set image only if it's downloaded from the web or fetched from disk cache (which takes far less time, but still noticeable). If it comes from memory - no animation needed. When you reload your collection view images are obviously cached in memory, so no animation will be used. Let me know if it worked for you.

score 1 · Answer 2 · answered May 27 '17 at 10:46

If you are looking for an animation before you load the image, try this:

cell.imageView.alpha=0;
[UIView animateWithDuration:_duration animations:^{

    cell.imageView.alpha = 1;

}];
[cell.imageView sd_setImageWithURL:[NSURL URLWithString:URL] completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {   
}];

If the image load takes time then use this :

[shopImg sd_setShowActivityIndicatorView:YES];
[shopImg sd_setIndicatorStyle:UIActivityIndicatorViewStyleGray];

before you call sd_setImageWithURL to show activity indicator. After the first cache, animateWithDuration will work like a charm.

This is a workaround, as NKorotkov said you can also write a cateory.

PS. I know this question is asked 2 years ago. This answer is for newbies in SDWebImage.

How to add a dissolve animation with SDWebImage with a UICollectionView

2 Answers2