ImageView 上的圆形进度条使用 SDWebImage 块

Question

我正在尝试使用 SDWebImage 实现一个类似于圆形进度条的 instagram 以进行图像加载。 1.我正在使用这段代码，但它不能正常工作。将图像应用到图像视图后，进度条不会隐藏。

1. 单元重用问题也导致了一些问题。
2. 还发出警告，提示我正在尝试更新后台线程中的进度条。

我怎样才能摆脱这些问题

- (void)setImageInImageView:(UIImageView *)imgv withURLString:(NSString *)str_url {

  //GuestDefaultProfilePic
    [imgv sd_setImageWithURL:[NSURL URLWithString:str_url] placeholderImage:[UIImage imageNamed:@"ImageGalleryBackground"] options: SDWebImageHighPriority progress:^(NSInteger receivedSize, NSInteger expectedSize){

        NSLog(@"the progress is %f", ((receivedSize*1.0f) * 100) /  expectedSize);
        progressView = [imgv viewWithTag:4321];

        if(progressView==nil)
        {
            progressView = [[THCircularProgressView alloc] initWithFrame:CGRectMake(imgv.center.x - 20 , imgv.center.y-20 , 60 , 60)];
            progressView.lineWidth = 5.0f;
            progressView.progressColor = [UIColor whiteColor];
            progressView.progressBackgroundColor = [UIColor grayColor];

            progressView.centerLabelVisible = YES;
            progressView.tag = 4321;
            [imgv addSubview:progressView];
        }

        dispatch_async(dispatch_get_main_queue(), ^{
            [progressView setPercentage:(receivedSize*1.0f) /  expectedSize];
        });
        if(receivedSize >= expectedSize)
        {
            progressView.hidden = YES;
        }
    }
    completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL){

       [progressView setHidden:YES];
        [progressView removeFromSuperview];
        [progressView setPercentage:0];
        [imgv setImage:image];

    }];


}

Answer 1

你可以试试这个，

1. 安装pod "MBCircularProgressBar"

2. 在你的自定义单元格上使用 UIView，就像你想要进度视图一样，并设置类 MBCircularProgressBarView。

   @IBOutlet weak var progressView: MBCircularProgressBarView!
   
   
       cell.imgAlbum.sd_setImage(with: URL(string: imageUrl), placeholderImage: UIImage(named: "placeholderImage"), options: .highPriority, progress: { (receivedSize :Int, ExpectedSize :Int, url:URL?) in
   
       DispatchQueue.main.async {
           cell.ActivityView.isHidden = false;
           cell.ActivityView.value = CGFloat(receivedSize)
           cell.ActivityView.maxValue = CGFloat(ExpectedSize)
       }
   }) { (image : UIImage?, error : Error?, cacheType : SDImageCacheType?, url:URL?) in
   
       DispatchQueue.main.async {
           UIView.animate(withDuration: 3.0, animations: {() -> Void in
               cell.ActivityView.isHidden = true;
           })}
   
       cell.imgBlur.removeBlurEffect()
   }
   

Answer 2

每次调用进度块时，您都会添加一个新的progressView。而是这样做：

THCircularProgressView *progressView = [imgv viewWithTag:4321];

if(progressView==nil)
{
  progressView = [[THCircularProgressView alloc] initWithFrame:CGRectMake(imgv.center.x - 20 , imgv.center.y-20 , 60 , 60)];
  progressView.lineWidth = 5.0f;
  progressView.progressColor = [UIColor whiteColor];
  progressView.progressBackgroundColor = [UIColor grayColor];

  progressView.centerLabelVisible = YES;
  progressView.tag = 4321;
  [imgv addSubview:progressView];
}

[progressView setPercentage:(receivedSize*1.0f) /  expectedSize];

或者，您可以使用this 库或this one，即referred to 在SDWebImage 文档中的referred to。

至于后台线程问题，将进度更新包装在一个调度块中：

dispatch_async(dispatch_get_main_queue(), ^{
  [progressView setPercentage:(receivedSize*1.0f) /  expectedSize];
});

Answer 3

查看github上的cocoapod SDWebImage-CircularProgressView：
https://github.com/NikKovV/SDWebImage-CircularProgressView

通过这个 pod 你可以实现

• 循环（使用 DACCircularProgress）
• 线性
• 自定义

进度视图。

这是 UIImageView 的一个类别。

例如

-(void)nkv_setImageWithURL:(NSURL *)url usingProgressViewType:(ProgressViewType)progressViewType orCustomProgressView:(UIProgressView *)progressView;

Answer 4

斯威夫特 4

mediumImageView.setImageWith(imageUrl, placeholderImage: placeHolder, options: [.progressiveDownload], usingProgressIndicatorWithProgressTintColor: UIColor.red, andTrackTintColor: UIColor.blue))