在 SDWebImage 中显示活动指示器答案

【问题标题】：Show activity indicator in SDWebImage在 SDWebImage 中显示活动指示器
【发布时间】：2012-06-29 12:56:40
【问题描述】：

我正在使用 SDWebView 图像，我想显示一个活动指示器作为占位符，同时从远程获取图像。

我在这里How to show an activity indicator in SDWebImage尝试了Malek的回答，但似乎

UIImage *cachedImage = [manager imageWithURL:url];

已弃用。

有没有人使用这个库可以告诉我如何在加载图像时插入活动指示器？

编辑

按照 Michael Frederick 的指示，我最终得到了这段代码，一切正常。

UIActivityIndicatorView *activityIndicator = [[[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite] autorelease];
activityIndicator.hidesWhenStopped = YES;
activityIndicator.hidden = NO;
[activityIndicator startAnimating];
activityIndicator.center = CGPointMake(self.tipImage.frame.size.width /2, self.tipImage.frame.size.height/2);
[imageView setImageWithURL:[NSURL URLWithString:imageString]
          placeholderImage:nil options:SDWebImageProgressiveDownload
                   success:^(UIImage *image) { [activityIndicator stopAnimating];[activityIndicator removeFromSuperview]; }
                   failure:^(NSError *error) {  [activityIndicator stopAnimating];[activityIndicator removeFromSuperview]; }];

[imageView addSubview:activityIndicator];

【问题讨论】：

您是否使用占位符图像？
我选择只使用微调器而不是图像，是的，它有效！
@Pheel 请不要在问题中添加答案，添加单独的答案（您可以回答自己的问题）。 SO 格式是问题+答案。

标签： objective-c uiactivityindicatorview sdwebimage

【解决方案1】：

This fork 支持此功能。看看the diff。

但是，一般来说，你可以很容易地做到这一点，而无需使用那个 fork：

__block UIActivityIndicatorView *activityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:activityStyle];
activityIndicator.center = imageView.center;
activityIndicator.hidesWhenStopped = YES;
[imageView setImageWithURL:[NSURL URLWithString:@"http://www.domain.com/path/to/image.jpg"]
               placeholderImage:[UIImage imageNamed:@"placeholder.png"]
                        success:^(UIImage *image) { [activityIndicator removeFromSuperview]; }
                        failure:^(NSError *error) { [activityIndicator removeFromSuperview]; }];

[imageView addSubview:activityIndicator];
[activityIndicator startAnimating];

【讨论】：

谢谢，我已经检查过了，但有些不清楚：我应该使用它还是不使用占位符？因为那行不通！那个 sn-p 应该放在哪里？
如果在执行“setImageWithURL”后添加activityIndicator，它可能会与占位符一起使用。 sn-p 应该放在通常设置 imageView 图像的任何位置。
不幸的是，它不起作用。它加载占位符等，但不加载activityIndicator
对于上面提到此解决方案的 cmets 不起作用：您需要在 addSubview 之后添加此行：[activityIndicator startAnimating];
我们什么时候应该停止动画？它正在工作，但在加载图像后它也没有停止。

【解决方案2】：

这就是你的做法：

[imageView setIndicatorStyle:UIActivityIndicatorViewStyleWhite];
[imageView setShowActivityIndicatorView:true];
[imageView sd_setImageWithURL:[NSURL URLWithString:imageUrl] placeholderImage:[UIImage imageNamed:@"defaultl_image"]];

【讨论】：

我确认这是当前最好的解决方案，因为主存储库最终在此提交中添加了活动指示器功能：github.com/rs/SDWebImage/commit/…
@SourabhSharma 这不是最好的，因为您需要为相同的功能编写 3 行代码。这也不是一个好习惯。
@DeepakChaudhary 好的，那么显示指标的最佳方式是什么？
@SourabhSharma 创建 imageView 的扩展或覆盖 imageview 的 init 方法，然后使用这两行。这样，您只需为整个应用程序编写一次。 :)

【解决方案3】：

这就是我的解决方案。在那个文件中：UIImageView+WebCache.m

找到那个方法并像这样改变：

- (void)setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder
{
    UIActivityIndicatorView *activity = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:(UIActivityIndicatorViewStyleGray)];
    [activity startAnimating];
    [activity setFrame:CGRectMake(self.frame.origin.x - 20, self.frame.origin.y - 10, self.frame.size.width, self.frame.size.height)];
    [self addSubview:activity];

    //[self setImageWithURL:url placeholderImage:placeholder options:0 progress:nil completed:nil];

    [self setImageWithURL:url
         placeholderImage:placeholder
                  options:0
                completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType)
     {
             [activity removeFromSuperview];
     }];
}

【讨论】：

完美运行。您也可以使用新名称添加它，保留原来的名称。

【解决方案4】：

最后的解决方案

您可以下载UIActivityIndicator-for-SDWebImage，这是将 UIActivityView 添加到您的SDWebImage 视图的最简单方法。使用 CocoaPods，只需将此行添加到您的 podfile：

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

【讨论】：

确实！过去没有这个解决方案。但是对于更新的解决方案 +1！

【解决方案5】：

SDWebImage 具有完美运行的内置活动指示器。试试这个：

更新：SWIFT 5 SDWebImage 5.x.x

        imgView.sd_imageIndicator = SDWebImageActivityIndicator.gray
        imgView.sd_setImage(with: url, placeholderImage: UIImage(named: "placeholder"))

斯威夫特 3：

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

【讨论】：

【解决方案6】：

对于 Swift 5.0 和 SDWebImage 5.0：

替换

imageView.sd_setShowActivityIndicatorView(true)
imageView.sd_setIndicatorStyle(.gray)

由

imageView.sd_imageIndicator = SDWebImageActivityIndicator.gray

【讨论】：

【解决方案7】：

以上代码略有错误。 'activityIndicator.center = imageView.center' 行没有为您提供正确的坐标来使进度视图居中。对我来说，它显示了单元格下方的指示器。

注意 - 我使用的是最新版本的 SDWebImage 代码，因此方法略有不同。我还在为 imageView 使用 UIButton

试试这个：

NSURL *url = [NSURL URLWithString:@"www.someimageurl.com"];
__block UIActivityIndicatorView *activityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
activityIndicator.frame = cell.imageView.bounds;
[cell.imageView addSubview:activityIndicator];
[activityIndicator startAnimating];
[cell.imageView setImageWithURL:url forState:UIControlStateNormal completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType) {
    [activityIndicator removeFromSuperview];
}];

【讨论】：

我一直在使用与您相同的代码，activityIndicator 将显示一秒钟然后立即消失。我已经评论了删除它的行......我尝试的任何事情都不会让它留下来。它只是出现然后立即消失。 :(

【解决方案8】：

我相信使用最新版本的 sdwebimage 这是一个更好的方法。

[self.customImageView setImageWithURL:imageURL
                             placeholderImage:nil
                                      options:nil
                                     progress:^(NSUInteger receivedSize, long long expectedSize) { [self.activityIndicator startAnimating]; }
                                    completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType) { [self.activityIndicator stopAnimating]; }];

注意：如果您没有属性设置，显然 self.activityindicator 将不起作用。

我会改用 Michael Frederick 的示例来创建活动指示器。

【讨论】：

【解决方案9】：

与上述 SWIFT 4 中的代码相同：

let activityIndicator = UIActivityIndicatorView.init(activityIndicatorStyle: UIActivityIndicatorViewStyle.gray)
    activityIndicator.center = addImage.center
    activityIndicator.hidesWhenStopped = true

    addImage.sd_setImage(with: URL(string: feed.image), completed: { (image: UIImage?, error: Error?, cacheType: SDImageCacheType, imageURL: URL?) in
        activityIndicator.removeFromSuperview()
    })

    addImage.addSubview(activityIndicator)
    activityIndicator.startAnimating()

【讨论】：

【解决方案10】：

SdWebImage 5.0

YOUR_IMAGEVIEW.sd_imageIndicator = SDWebImageActivityIndicator.gray

【讨论】：

【解决方案11】：

[cell.dreamImageView setImageWithURL:[NSURL URLWithString:[NSString stringWithFormat:@"%@",dream.thumbnail]] placeholderImage:[UIImage imageNamed:@"dream_bg_2.png"] options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {

    CGFloat domandeFloat = [[NSNumber numberWithInt: receivedSize] floatValue];
    CGFloat corretteFloat = [[NSNumber numberWithInt: expectedSize] floatValue];


    float currentProgress = domandeFloat/corretteFloat;

     NSLog(@"progress %f",currentProgress);
    cell.progressView.progress = currentProgress;

    //[self.dreamsTableView reloadData];


} completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType) {

    cell.progressView.hidden = YES;
}];

【讨论】：

为什么我的expectedSize 在某些图片上是0？

【解决方案12】：

为 Swift 2.0 更新了使用 SDWebImage 加载图片 URL 的解决方案

imageView.setShowActivityIndicatorView(true)

imageView.setIndicatorStyle(.White)

【讨论】：

【解决方案13】：

根据 Can Ürek 的回答，您可能想要创建一个类别以使其更易于在多个应用程序中使用，并且无需修改 SDWebImage 框架。

头文件：

#import <UIKit/UIKit.h>

#import <SDWebImage/UIImageView+WebCache.h>

@interface UIImageView (WebCacheWithActivityIndicator)

- (void)setImageShowingActivityIndicatorWithURL:(NSURL *)url completed:(SDWebImageCompletedBlock)completedBlock;

@end

实现文件：

#import "UIImageView+WebCacheWithActivityIndicator.h"

@implementation UIImageView (WebCacheWithActivityIndicator)

- (void)setImageShowingActivityIndicatorWithURL:(NSURL *)url completed:(SDWebImageCompletedBlock)completedBlock
{
    UIActivityIndicatorView* activityIndication = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];

    [activityIndication setFrame:CGRectMake((self.frame.size.width - activityIndication.frame.size.width) / 2 , (self.frame.size.height - activityIndication.frame.size.height) / 2 , activityIndication.frame.size.width , activityIndication.frame.size.width)];
    [self addSubview:activityIndication];

    [activityIndication startAnimating];

    [self setImageWithURL:url completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType) {

        if(completedBlock)
        {
            completedBlock(image,error,cacheType);
        }

        [activityIndication stopAnimating];
        [activityIndication removeFromSuperview];
    }];
}
@end

希望对大家有所帮助

干杯

【讨论】：

【解决方案14】：

另一种解决方案是使用动画图像作为占位符图像，方法是：

[UIImage animatedImageNamed:@"animated_placeholder" duration:1]

【讨论】：

【解决方案15】：

使用更新的library（解决iOS 8 上的崩溃问题），我们有以下方法-

- (void)sd_setImageWithURL:(NSURL *)url 
{
    [self sd_setImageWithURL:url placeholderImage:nil options:0 progress:nil completed:nil];
}

我们可以看到添加进度块和完成块的选项，我们可以简单地在进度块中添加活动指示器并在完成块中删除。

在此处添加活动指示器的自定义方法-

- (void)sd_setImageWithURL:(NSURL *)url {

    [self sd_setImageWithURL:url placeholderImage:nil options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {
        UIActivityIndicatorView *activity = nil;
        activity = (UIActivityIndicatorView *)[self viewWithTag:100000];
        if (!activity) {
            activity = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
            [activity setTag:100000];
            [activity setHidesWhenStopped:YES];
            [activity setCenter:CGPointMake(self.frame.size.width/2.0f,self.frame.size.height/2.0f)];
            [self addSubview:activity];
        }
        else {
            [activity setCenter:CGPointMake(self.frame.size.width/2.0f,self.frame.size.height/2.0f)];
        }
        [activity startAnimating];

    } completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {
        UIActivityIndicatorView *activity = (UIActivityIndicatorView *)[self viewWithTag:100000];
        if ([activity isKindOfClass:[UIActivityIndicatorView class]]) {
            [activity stopAnimating];
        }
    }];
}

这将在图像下载过程中将 UIActivityIndicatorView 添加到 UIImageView 的中心，并在完成时移除。

【讨论】：

【解决方案16】：

当用户反复上下滚动列表时，我的列表相当滞后。我发现在重复调用cellForItemAtIndexPath时，activityindicator被无限添加了。

要解决这个问题，请在您的活动指示器处添加一个标签：

activityIndicator.tag = 9999;

在创建 UIActivityIndicator 之前，添加这些行以删除之前的活动指示器，然后再添加新的：

UIView* toDeleteLoader = [cell viewWithTag:9999];
if(toDeleteLoader != nil){
    [toDeleteLoader removeFromSuperview];
}

注意：标签内容可以是任何不会在您的单元格中使用的数字。

【讨论】：

【解决方案17】：

对我有用的最佳解决方案如下。下载图像时显示进度指示器非常漂亮且令人鼓舞。我使用UICircularSlider 作为圆形进度视图。你也可以试试。

    [_imgPost sd_setImageWithURL:urlPost placeholderImage:zeroImage options:SDWebImageContinueInBackground progress:^(NSInteger receivedSize, NSInteger expectedSize)
    {
        CGFloat domandeFloat = [[NSNumber numberWithInteger: receivedSize] floatValue];
        CGFloat corretteFloat = [[NSNumber numberWithInteger: expectedSize] floatValue];


        float currentProgress = (domandeFloat/corretteFloat)*100;

        NSLog(@"progress %.f%%",currentProgress);
        DBG(@"%li, %li", receivedSize, expectedSize);
        [_progress setValue:currentProgress];
    } completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {

        [_progress setHidden:YES];
    }];

这里_progress是UICircularSlider的一个实例

【讨论】：

【解决方案18】：

SDWebImage 5.0 支持使用 SDWebImageActivityIndicator 类显示活动指示器。

let imageView = UIImageView()
imageView.sd_imageIndicator = SDWebImageActivityIndicator.gray

【讨论】：