web-dev-qa-db-ja.com

アニメーション付きのUIImageView + AFNetworking setImageWithURL

AFNetworkingを使用すると、サーバーから画像をダウンロードしてUIImageViewに入れるのが非常に簡単です。

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

この画像をエフェクト(多分フェード)で置き換えたい場合はどうですか?

画像の多いスライドショーを作りたいからです。

22
Daniel Campos

animateWithDurationは、setImageWithURLブロックを提供するsuccessのレンディションと組み合わせて使用​​できます。

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

または、プレースホルダー画像が空白でない場合は、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];

更新:

ちなみに、ダウンロードが完了するまでイメージビュー(およびself、ビューまたはビューコントローラーも参照する)が保持されることに懸念がある場合は、次のことを行うことができます。

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

その場合でも、ダウンロードが完了するまでイメージビューは保持されるため、ビューコントローラーのdeallocメソッドで進行中のダウンロードをキャンセルすることもできます。

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

    [_imageView cancelImageRequestOperation];
}
45
Rob

オンラインリクエストが正常に完了したら、imageViewのアルファを0から1にアニメーション化してみてください。

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

もちろん、完了ブロック内で好きな他のアニメーションを使用できます!

3