UIImageView+AFNetworking setImageWithURL with animation

Question

With AFNetworking, is very simple to download an image from a server and put into an UIImageView:

[imageView setImageWithURL:[NSURL URLWithString:@\"http://i         


        

Answer 1

Try animating the alpha of the imageView from 0 to 1 when the online request completes with success:

// You should not call an ivar from a block (so get a weak reference to the imageView)
__weak UIImageView *weakImageView = self.imageView;

// The AFNetworking method to call
[imageView setImageWithURLRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://host.com/image1.png"]] placeholderImage:nil] 
                   success:^(NSURLRequest *request, NSHTTPURLResponse *response, UIImage *image){ 
                     // Here you can animate the alpha of the imageview from 0.0 to 1.0 in 0.3 seconds
                     [weakImageView setAlpha:0.0];
                     [UIView beginAnimations:nil context:NULL];
                     [UIView setAnimationDuration:0.3];
                     [weakImageView setAlpha:1.0];
                     [UIView commitAnimations];
                   }
                   failure:^(NSURLRequest *request, NSHTTPURLResponse *response, NSError *error){
                     // Your failure handle code     
                   }

Of course you can use any other animation you like inside the completion block!

Answer 2

You can use animateWithDuration in conjunction with the rendition of setImageWithURL that supplies the success block, e.g.

[imageView setImageWithURL:[NSURL URLWithString:@"http://i.imgur.com/r4uwx.jpg"] 
          placeholderImage:[UIImage imageNamed:@"placeholder-avatar"]
                   success:^(NSURLRequest *request, NSHTTPURLResponse *response, UIImage *image) {
                       self.imageView.alpha = 0.0;
                       self.imageView.image = image;
                       [UIView animateWithDuration:0.25
                                        animations:^{
                                            self.imageView.alpha = 1.0;
                                        }];
                   }
                   failure:NULL];

Or, if you placeholder image isn't blank, you would probably want to cross dissolve via transitionWithView:

[imageView setImageWithURL:[NSURL URLWithString:@"http://i.imgur.com/r4uwx.jpg"] 
          placeholderImage:[UIImage imageNamed:@"placeholder-avatar"]
                   success:^(NSURLRequest *request, NSHTTPURLResponse *response, UIImage *image) {
                       [UIView transitionWithView:self.imageView
                                         duration:0.3
                                          options:UIViewAnimationOptionTransitionCrossDissolve
                                       animations:^{
                                           self.imageView.image = image;
                                       }
                                       completion:NULL];
                   }
                   failure:NULL];

---

Update:

By the way, if you're concerned about the fact that the image view (and if you refer to self, the view or the view controller, too) being retained until the download is done, you could:

__weak UIImageView *weakImageView = self.imageView;
[imageView setImageWithURL:[NSURL URLWithString:@"http://i.imgur.com/r4uwx.jpg"] 
          placeholderImage:[UIImage imageNamed:@"placeholder-avatar"]
                   success:^(NSURLRequest *request, NSHTTPURLResponse *response, UIImage *image) {
                       UIImageView *strongImageView = weakImageView; // make local strong reference to protect against race conditions
                       if (!strongImageView) return;

                       [UIView transitionWithView:strongImageView
                                         duration:0.3
                                          options:UIViewAnimationOptionTransitionCrossDissolve
                                       animations:^{
                                           strongImageView.image = image;
                                       }
                                       completion:NULL];
                   }
                   failure:NULL];

Even if you do that, the image view is retained until the download completes, so you could optionally also cancel any download in progress in the dealloc method of the view controller:

- (void)dealloc
{
    // if MRC, call [super dealloc], too

    [_imageView cancelImageRequestOperation];
}