web-dev-qa-db-fra.com

UIImageView + AFNetworking setImageWithURL avec animation

Avec AFNetworking, il est très simple de télécharger une image à partir d'un serveur et de la placer dans une UIImageView:

[imageView setImageWithURL:[NSURL URLWithString:@"http://i.imgur.com/r4uwx.jpg"] placeholderImage:[UIImage imageNamed:@"placeholder-avatar"]];

Et si je voulais faire ce remplacement d'image avec un effet (peut-être s'estomper) ???

C'est parce que je veux faire un diaporama avec beaucoup d'images.

objective-cuiimageviewafnetworking
22
Daniel Campos

Vous pouvez utiliser animateWithDuration en conjonction avec le rendu de setImageWithURL qui fournit le bloc success, par exemple.

[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];

Ou, si votre image d'espace réservé n'est pas vide, vous voudrez probablement effectuer une dissolution croisée 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];

Mettre à jour:

Soit dit en passant, si vous êtes préoccupé par le fait que la vue d'image (et si vous faites référence à self, à la vue ou au contrôleur de vue, également) soit conservée jusqu'à ce que le téléchargement soit terminé, vous pouvez:

__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];

Même si vous faites cela, la vue de l'image est conservée jusqu'à la fin du téléchargement, vous pouvez donc éventuellement annuler également tout téléchargement en cours dans la méthode dealloc du contrôleur de vue:

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

    [_imageView cancelImageRequestOperation];
}
45
Rob

Essayez d'animer l'alpha de l'imageView de 0 à 1 lorsque la demande en ligne se termine avec succès:

// 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     
                   }

Bien sûr, vous pouvez utiliser n'importe quelle autre animation que vous aimez dans le bloc d'achèvement!

3
George Sachpatzidis