web-dev-qa-db-ja.com

SDWebImageでアクティビティインジケーターを表示する方法

現在、以下のことにより、SDWebImageをプロジェクトに統合しています。

1)#import "UIButton + WebCache.h"

2)[button setImageWithURL:url placeholderImage:[UIImage imageNamed:@ "no_photo.png"]];

そのため、それぞれのボタンの上にURLに存在する画像のリストが表示されます。

しかし、画像がダウンロードされているときにボタンの上にアクティビティインジケーターを表示したいのですが、どうすればよいですか?

18
raaz

私にとって魅力のように機能します:

スウィフト3:

imgView.setShowActivityIndicator(true)
imgView.setIndicatorStyle(.gray)
imgView.sd_setImage(with: URL(string: urlString), placeholderImage: UIImage(named: "placeholder"))

Swift 4 :(編集:更新)

imgView.sd_setShowActivityIndicatorView(true)
imgView.sd_setIndicatorStyle(.gray)
imgView.sd_setImage(with: URL(string: urlString), placeholderImage: UIImage(named: "placeholder"))

Swift 5:SDWebImage(5.x.x)

imgView.sd_imageIndicator = SDWebImageActivityIndicator.gray
imgView.sd_setImage(with: URL(string: urlString), placeholderImage: UIImage(named: "placeholder"))
57

最後の解決策

UIActivityIndi​​cator-for-SDWebImage をダウンロードできます。これは、UIActivityViewを SDWebImage ビューに追加する最も簡単な方法です。 。 CocoaPodsを使用して、次の行をポッドファイルに追加するだけです。

pod 'UIActivityIndicator-for-SDWebImage'

好みに応じて、次のいずれかの行を使用できます。

- (void)setImageWithURL:(NSURL *)url usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url completed:(SDWebImageCompletionBlock)completedBlock usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder completed:(SDWebImageCompletionBlock)completedBlock usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options completed:(SDWebImageCompletionBlock)completedBlock usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;
- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options progress:(SDWebImageDownloaderProgressBlock)progressBlock completed:(SDWebImageCompletionBlock)completedBlock usingActivityIndicatorStyle:(UIActivityIndicatorViewStyle)activityStyle;

使用例

インポートするだけ

#import <UIActivityIndicator-for-SDWebImage/UIImageView+UIActivityIndicatorForSDWebImage.h>

このコードを使用します

[imageView setImageWithURL:[NSURL URLWithString:@"https://media.licdn.com/mpr/mpr/wc_200_200/p/1/005/07f/0a3/30cb8dd.jpg"] placeholderImage:[UIImage imageNamed:@"myImage.jpg"] usingActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
5
E-Riddie

これを行うために私が見つけた最良の方法は、SDWebImageManagerクラスを使用することです。次に、ViewControllerまたはその他のクラスがSDWebImageManagerDelegateプロトコルに準拠する必要があります。

SDWebImageManager *manager = [SDWebImageManager sharedManager];
UIImage *cachedImage = [manager imageWithURL:url];

if (cachedImage) {
    [button setImage:cachedImage];
    // stop or remove your UIActivityIndicatorView here
}
else {
    [manager downloadWithURL:url delegate:self];
}

画像がダウンロードされると、デリゲートメソッドが呼び出されます。

- (void)webImageManager:(SDWebImageManager *)imageManager didFinishWithImage:(UIImage *)image {
    [button setImage:image];
    // stop or remove your UIActivityIndicatorView here
}

画像のダウンロード中にエラーが発生した場合のデリゲートメソッドもあります

- (void)webImageManager:(SDWebImageManager *)imageManager didFailWithError:(NSError *)error {
    // Handle error here
}

複数のボタンがある場合、画像のダウンロード後に、どの画像がどのボタンに属するかを判断する際に問題が発生する可能性があります。この場合、上記のようにダウンロードを処理してから、独自のイメージを更新するボタンサブクラスが必要になる場合があります。

お役に立てば幸いです。

3
stephenmuss

最良の方法は、UIImageView + WebCache.mのすべての「setImage」関数にactivityIndi​​catorを追加し、その後「webImageManager:r didFinishWithImage:」で削除することです。デバイスでテストすると、スムーズに動作します。彼女の例:

  - (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder
 {


UIActivityIndicatorView *activity = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:(UIActivityIndicatorViewStyleWhiteLarge)];
[activity startAnimating];
[activity setCenter:self.center];
[self addSubview:activity];
[activity release];



SDWebImageManager *manager = [SDWebImageManager sharedManager];

UIImage *cachedImage = [manager imageWithURL:url];

if (cachedImage)
{
    // the image is cached -> remove activityIndicator from view
    for (UIView *v in [self subviews])
    {
        if ([v isKindOfClass:[UIActivityIndicatorView class]])
        {
            [activity removeFromSuperview];
        }
    }
}

[self setImageWithURL:url placeholderImage:placeholder options:0];
}

そして、フェードアニメーションでそれを削除します;):

 - (void)webImageManager:(SDWebImageManager *)imageManager didFinishWithImage:(UIImage *)image
{ 

for (UIView *v in [self subviews])
{
    if ([v isKindOfClass:[UIActivityIndicatorView class]])
    {
       // NSLog(@"-didFinishWithImage-");
        [((UIActivityIndicatorView*)v) stopAnimating];
        [v removeFromSuperview];
    }
}


[UIView beginAnimations:@"fadeAnimation" context:NULL]; 
[UIView setAnimationDuration:0.9];
self.alpha = 0;
self.image = image;
self.alpha=1;
//[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self cache:YES]; 
[UIView commitAnimations];

 }
3
Red Mak

Swift 5

//pass true for showing indicator View
self.imageView.sd_setShowActivityIndicatorView(true)

//give style value
self.imageView.sd_setIndicatorStyle(UIActivityIndicatorView.Style.gray)

//Set your image as you are want to do
self.imageView.sd_setImage(with: URL(string: self.imageUrl), placeholderImage: UIImage())
0
pravir