SDWebImage 图片下载缓存框架 常用方法及原理

功能:图片下载、图片缓存、下载进度监听、gif处理等等 项目地址:https://github.com/rs/SDWebImage

常见面试题:

  1. SDWebImage的最大并发数是多少? _downloadQueue.maxConcurrentOperationCount = 6;
  2. SDWebImages是如何识别图片的? NSData+ImageContentType.m中,根据图片文件十六进制数据的第一个字节判断

图片的十六进制第一个字节.png

  1. SDWebImage 缓存图片命名规则? 为了防止名称重复,对其进行 md5 运算
  2. 默认下载的超时时长是多少?15秒
  3. 默认缓存的时间?一周 _maxCacheAge = kDefaultCacheMaxCacheAge; static const NSInteger kDefaultCacheMaxCacheAge = 60 * 60 * 24 * 7; // 1 week
  4. SDWebImage用什么类型缓存图片?NSCache SDImageCache内处理内存警告,以通知的方式,clearMemory
  5. cleanDisk的执行过程 i. 先遍历所有的缓存文件,记录过期的文件,计算缓存文件的总大小 ii. 删除过期的文件 iii. 判断maxCacheSize的值是否>0,如果大于0再判断缓存的文件总大小是否大于maxCacheSize iv.如果缓存文件的总大小超过maxCacheSize,删除最早的文件 注意:.jpg、.gif等文件需要把扩展名填上,png不需要

一、下载缓存

#import "UIImageView+WebCache.h"' 介绍:使用SDWebImage可以去加载远程图片,而且还会缓存图片,下次请求会看一下是否已经存在于缓存中,如果是的话直接取本地缓存,如果不是的话则重新请求。

1、获取当前图片的地址

- (NSURL *)sd_imageURL;

2、下载网络图片并缓存

  1. - (void)sd_setImageWithURL:(NSURL *)url;
  2. - (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder;
  3. - (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options;
  4. 下载图片的线程执行完后回调 - (void)sd_setImageWithURL:(NSURL *)url completed: (SDWebImageCompletionBlock)completedBlock;
  5. - (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder completed:(SDWebImageCompletionBlock)completedBlock;
  6. - (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options completed:(SDWebImageCompletionBlock)completedBlock;
  7. 下载图片并获取图片下载进度 progressBlock - (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options progress:(SDWebImageDownloaderProgressBlock)progressBlock completed:(SDWebImageCompletionBlock)completedBlock;

例子:下载图片并且打印图片的下载进度 NSURL *url = [NSURL URLWithString:@"http://picview01.baomihua.com/photos/20120624/m_14_634761470842343750_15728444.jpg"]; [self.imageView sd_setImageWithURL:url placeholderImage:nil options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) { //乘1.0是为了转换成float类型 float progress = receivedSize * 1.0 / expectedSize; NSLog(@"下载进度 %f",progress); } completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) { NSLog(@"完成"); }];

  1. 先从本地缓存中查找请求的图片,如果有先用本地图片占位,再从服务器请求下载图片 - (void)sd_setImageWithPreviousCachedImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options progress:(SDWebImageDownloaderProgressBlock)progressBlock completed:(SDWebImageCompletionBlock)completedBlock;
  2. 下载一组动画图片,并自动播放动画(arrayOfURLs为一组图片的地址数组) - (void)sd_setAnimationImagesWithURLs:(NSArray *)arrayOfURLs;
  3. 取消当前下载 - (void)sd_cancelCurrentImageLoad;
  4. 取消下载一组动画图片 - (void)sd_cancelCurrentAnimationImagesLoad;
  5. 设置是否显示活的指示器以及样式 注意:必须在请求下载图片之前给UIImageView设置!不然无法显示! - (void)setShowActivityIndicatorView:(BOOL)show; - (void)setIndicatorStyle:(UIActivityIndicatorViewStyle)style;

二、 UIButton的类扩展

#import "UIButton+WebCache.h"

  1. 获取当前按钮图片的地址 - (NSURL *)sd_currentImageURL;
  2. 获取指定状态下按钮图片地址 - (NSURL *)sd_imageURLForState:(UIControlState)state;
  3. 设置不同UIControlState状态下的按钮图片 - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state; - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder; - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options; - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state completed:(SDWebImageCompletionBlock)completedBlock; - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder completed:(SDWebImageCompletionBlock)completedBlock; - (void)sd_setImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options completed:(SDWebImageCompletionBlock)completedBlock;
  4. 设置不同状态的按钮背景图片 - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state; - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder; - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options; - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state completed:(SDWebImageCompletionBlock)completedBlock; - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder completed:(SDWebImageCompletionBlock)completedBlock; - (void)sd_setBackgroundImageWithURL:(NSURL *)url forState:(UIControlState)state placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options completed:(SDWebImageCompletionBlock)completedBlock;
  5. 取消当前指定状态按钮图片下载 - (void)sd_cancelImageLoadForState:(UIControlState)state;
  6. 取消当前指定状态按钮背景图片下载 - (void)sd_cancelBackgroundImageLoadForState:(UIControlState)state;

三、参数介绍

options 枚举:
  1. SDWebImageRetryFailed 失败后重试, 默认如果下载失败,这个url会被加入黑名单并且不会尝试再次下载,设置这个枚举会阻止把失败的url加入黑名单,不断尝试重新下载
  2. SDWebImageLowPriority 延迟下载, 默认情况下,图片会在交互发生的时候下载(例如你滑动tableview的时候),这个枚举会禁止这个特性,导致的结果就是在scrollview减速的时候才会开始下载(也就是你滑动的时候scrollview不下载,你手从屏幕上移走,scrollview开始减速的时候才会开始下载图片)
  3. SDWebImageCacheMemoryOnly 只在内存缓存
  4. SDWebImageProgressiveDownload 渐进式下载,显示的图像是逐步在下载
  5. SDWebImageRefreshCached 刷新缓存,有时本地图片更新后与服务器没有同步一致时可以使用(例如更新头像),专门处理相同url,但不同image的情况的 原因:默认情况下,SDWebImage会忽略Header中的缓存设置,将图片以url为key进行保存,url与图片是一一对应关系。所以请求同一个url时,SDWebImage会从缓存中取得图片。一般的情况下用此方法可以满足我们的应用要求,但是如果你请求同一个url,而这张图片在服务器端更新了,本地客户端再次请求时还是会返回缓存中的旧图片,例如加载头像类经常更新的图片时,就会出现头像不能更新的问题,由于url与图片一一对应,一种解决的办法是改变部分url地址方式实现更新,不过这种方法操作起来很复杂, 另一种将第三个参数设置为SDWebImageRefreshCached就可以实现图片更新操作了。
  6. SDWebImageContinueInBackground 启动后台下载,app进入后台后继续下载
  7. SDWebImageHandleCookies 处理存储在NSHTTPCookieStore中的cookie NSMutableURLRequest.HTTPShouldHandleCookies = YES;
  8. SDWebImageAllowInvalidSSLCertificates 允许使用无效的SSL证书,主要用于测试目的,在正式环境中慎用
  9. SDWebImageHighPriority 优先下载
  10. SDWebImageDelayPlaceholder 等待下载完成后再显示占位图片,延迟显示占位图片
  11. SDWebImageTransformAnimatedImage 改变动画形象
  12. SDWebImageAvoidAutoSetImage 下载完成后手动设置图片,默认是下载完成后自动放到ImageView上
SDWebImageCompletionBlock

typedef void(^SDWebImageCompletionBlock)(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL); 参数: (1)请求的图片 (2)请求图片为空的错误 (3) SDImageCacheType 缓存类型,下次是从网上获取还是从本地获取, 枚举: SDImageCacheTypeNone 永不缓存,但是从网上下载 SDImageCacheTypeDisk 只缓存到磁盘上 SDImageCacheTypeMemory 只缓存到内存中 (4)图片的网络地址

SDWebImageDownloaderProgressBlock

typedef void(^SDWebImageDownloaderProgressBlock)(NSInteger receivedSize, NSInteger expectedSize); progress 参数: receivedSize 接收到的字节数 expectedSize 期望下载的字节数 //乘1.0是为了转换成float类型 float progress = receivedSize * 1.0 / expectedSize;


四、本地缓存

#import"SDImageCache.h" 介绍:很多时候我们可能拍照得到的一张图片要多个地方使用,那么我们就希望可以把这张图片放到缓存里面,然后每次用这张图片的时候就去通过特定的方式取即可。

属性:
  1. 是否压缩图片 @property (assign, nonatomic) BOOL shouldDecompressImages;
  2. 是否禁用iCloud,默认YES @property (assign, nonatomic) BOOL shouldDisableiCloud;
  3. 是否缓存到内存,默认YES @property (assign, nonatomic) BOOL shouldCacheImagesInMemory;
  4. 最大缓存成本,针对内存 @property (assign, nonatomic) NSUInteger maxMemoryCost;
  5. 最大缓存个数,针对内存 @property (assign, nonatomic) NSUInteger maxMemoryCountLimit;
  6. 最大缓存时间,单位:秒,针对磁盘缓存,默认是一周,自动把一星期以前缓存的图片删除掉 @property (assign, nonatomic) NSInteger maxCacheAge;
  7. 最大缓存大小,单位字节,针对磁盘,默认无限制0,需要自己设置 @property (assign, nonatomic) NSUInteger maxCacheSize;
方法:
1、获取缓存单例对象

+ (SDImageCache *)sharedImageCache;

2、创建缓存空间
  1. 在沙盒的cache目录下创建一个指定名字的缓存空间(文件夹) - (id)initWithNamespace:(NSString *)ns;
  2. 在磁盘指定目录(directory)下创建一个指定名字的缓存空间 - (id)initWithNamespace:(NSString *)ns diskCacheDirectory:(NSString *)directory;
  3. 添加一个只读的缓存路径 - (void)addReadOnlyCachePath:(NSString *)path;
3、缓存图片到内存和磁盘上
  1. 往内存和磁盘上存储一个图片(key参数是唯一的,用来取出图片,一般是图片的绝对路径) - (void)storeImage:(UIImage *)image forKey:(NSString *)key; 例子: SDImageCache *imageCache = [SDImageCache sharedImageCache]; [imageCache storeImage:image forKey:@"myphoto" toDisk:YES];
  2. 缓存一个图片到内存,并设置是否缓存到磁盘上 - (void)storeImage:(UIImage *)image forKey:(NSString *)key toDisk:(BOOL)toDisk;
  3. 缓存的基础方法,缓存一个图片到内存,并设置是否缓存到磁盘上(recalculate 是否重新计算图片的data , imageData 图片的data) - (void)storeImage:(UIImage *)image recalculateFromImage:(BOOL)recalculate imageData:(NSData *)imageData forKey:(NSString *)key toDisk:(BOOL)toDisk;
4、异步在磁盘上查找指定key图片的缓存,完成后回调block

- (NSOperation *)queryDiskCacheForKey:(NSString *)key done:(SDWebImageQueryCompletedBlock)doneBlock;

5、从内存、磁盘获取指定key的图片

- (UIImage *)imageFromMemoryCacheForKey:(NSString *)key; - (UIImage *)imageFromDiskCacheForKey:(NSString *)key;

6、删除指定key的图片(fromDisk 是否删除磁盘缓存,completion删除结束后回调无参block)

- (void)removeImageForKey:(NSString *)key; - (void)removeImageForKey:(NSString *)key withCompletion:(SDWebImageNoParamsBlock)completion; - (void)removeImageForKey:(NSString *)key fromDisk:(BOOL)fromDisk; - (void)removeImageForKey:(NSString *)key fromDisk:(BOOL)fromDisk withCompletion:(SDWebImageNoParamsBlock)completion;

7、清除所有缓存
  1. 清除所有内存图片缓存 - (void)clearMemory;
  2. 清除所有磁盘缓存图片时回调一个block - (void)clearDiskOnCompletion:(SDWebImageNoParamsBlock)completion;
  3. 清除所有磁盘缓存 - (void)clearDisk;
  4. 从磁盘删除所有过期的图片时立即调用 - (void)cleanDiskWithCompletionBlock:(SDWebImageNoParamsBlock)completionBlock;
  5. 删除所有磁盘上过期的缓存图片 - (void)cleanDisk;
8、获取缓存大小、缓存个数
  1. 获取磁盘缓存大小 - (NSUInteger)getSize;
  2. 获取磁盘上缓存图片的个数 - (NSUInteger)getDiskCount;
  3. 异步计算磁盘缓存的大小 - (void)calculateSizeWithCompletionBlock:(SDWebImageCalculateSizeBlock)completionBlock;
9、从磁盘查找缓存图片
  1. 异步从磁盘中查找指定key的图片缓存,查找完成后回调这个block(该block永远在主线程执行) - (void)diskImageExistsWithKey:(NSString*)key completion:(SDWebImageCheckCacheCompletionBlock)completionBlock;
  2. 检查磁盘中是否存在指定key的图片缓存 - (BOOL)diskImageExistsWithKey:(NSString *)key;
  3. 通过图片的key获取其缓存路径(path:缓存路径的根路径) - (NSString*)cachePathForKey:(NSString*)key inPath:(NSString*)path;
  4. 从默认缓存路径下获取指定key图片的路径 - (NSString *)defaultCachePathForKey:(NSString *)key;

五、播放gif

#import "UIImage+GIF.h"

  1. 播放指定名字gif图片 + (UIImage *)sd_animatedGIFNamed:(NSString *)name;
  2. 用指定gif的data播放 + (UIImage *)sd_animatedGIFWithData:(NSData *)data;
  3. 设置gif图片尺寸 - (UIImage *)sd_animatedImageByScalingAndCroppingToSize:(CGSize)size;

六、SDWebImage 实现原理

SDWebImage框架结构.png

先讲下大体架构:最外层是一个SDWebImageManager单例工具类管理另外两个单例类,一个是作下载处理的SDWebImageDownloader,它管理多个下载操作SDWebImageDownloaderOperation,一个作缓存处理的SDImageCache。

大体执行过程:当我们需要下载图片时,先让SDImageCache从缓存中找,如果找不到就异步从硬盘中读取图片,如果读取到就将图片缓存到内存并回调给SDWebImageManager,如果找不到就让SDWebImageDownloader 执行下载操作,在 SDWebImageDownloaderOperation 单个图片的下载操作中利用 NSURLConnection 执行下载,实现代理监听下载进度等,下载完成后交给SDWebImageDecoder 图片异步解码,完成后回调给SDWebImageDownloader,再回调给SDWebImageManager,再让SDImageCache去执行内存和磁盘(异步)的缓存操作。

具体过程:

  • UIImageView+WebCache: setImageWithURL:placeholderImage:options: 先显示 placeholderImage ,同时由SDWebImageManager 根据 URL 来在本地查找图片。
  • SDWebImageManager: downloadWithURL:delegate:options:userInfo: SDWebImageManager是将UIImageView+WebCache同SDImageCache链接起来的类, SDImageCache: queryDiskCacheForKey:delegate:userInfo:用来从缓存根据CacheKey查找图片是否已经在缓存中
  • 如果内存中已经有图片缓存, SDWebImageManager会回调SDImageCacheDelegate : imageCache:didFindImage:forKey:userInfo:
  • 而 UIImageView+WebCache 则回调SDWebImageManagerDelegate: webImageManager:didFinishWithImage:来显示图片。
  • 如果内存中没有图片缓存,那么生成 NSInvocationOperation 添加到队列,从硬盘查找图片是否已被下载缓存。
  • 根据 URLKey 在硬盘缓存目录下尝试读取图片文件。这一步是在 NSOperation 进行的操作,所以回主线程进行结果回调 notifyDelegate:
  • 如果上一操作从硬盘读取到了图片,将图片添加到内存缓存中(如果空闲内存过小,会先清空内存缓存)。SDImageCacheDelegate 回调 imageCache:didFindImage:forKey:userInfo:进而回调展示图片。
  • 如果从硬盘缓存目录读取不到图片,说明所有缓存都不存在该图片,需要下载图片,回调 imageCache:didNotFindImageForKey:userInfo:
  • 共享或重新生成一个下载器 SDWebImageDownloader 开始下载图片。
  • 图片下载由 NSURLConnection 来做,实现相关 delegate 来判断图片下载中、下载完成和下载失败。
  • connection:didReceiveData: 中利用 ImageIO 做了按图片下载进度加载效果。
  • connectionDidFinishLoading: 数据下载完成后交给 SDWebImageDecoder 做图片解码处理。
  • 图片解码处理在一个 NSOperationQueue 完成,不会拖慢主线程 UI。如果有需要对下载的图片进行二次处理,最好也在这里完成,效率会好很多。
  • 在主线程 notifyDelegateOnMainThreadWithInfo: 宣告解码完成,imageDecoder:didFinishDecodingImage:userInfo: 回调给 SDWebImageDownloader。
  • imageDownloader:didFinishWithImage: 回调给 SDWebImageManager 告知图片下载完成。
  • 通知所有的 downloadDelegates 下载完成,回调给需要的地方展示图片。
  • 将图片保存到 SDImageCache 中,内存缓存和硬盘缓存同时保存。
  • 写文件到硬盘在单独 NSInvocationOperation 中完成,避免拖慢主线程。
  • 如果是在iOS上运行,SDImageCache 在初始化的时候会注册notification 到 UIApplicationDidReceiveMemoryWarningNotification 以及 UIApplicationWillTerminateNotification,在内存警告的时候清理内存图片缓存,应用结束的时候清理过期图片。
  • SDWebImagePrefetcher 可以预先下载图片,方便后续使用。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏一“技”之长

iOS8新特性扩展(Extension)应用之四——自定义键盘控件

        iOS8系统的开放第三方键盘,使得用户在输入法的选择上更加自主灵活,也更加贴近不同语言的输入风格。这篇博客,将介绍如何开发一个第三方的键盘控件。

19310
来自专栏Java技术分享

基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化

在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验,Bootstrap开发也一样,我们往往在页面新增、编辑...

33650
来自专栏青玉伏案

IOS开发之获取Storyboard创建的ViewController

  前面的两篇博客都是学习有关屏幕适配也就是相对布局的东西,这篇博客中将会学习视图间的切换。视图间的切换我们可以用代码完成或者用storyboard来建立各个视...

28180
来自专栏IMWeb前端团队

react native入门实战(一)

本文作者:IMWeb 朱灵子 原文出处:IMWeb社区 未经同意,禁止转载 react native入门实战(一) 本文举一个简单的例子介绍如何进行r...

33570
来自专栏更流畅、简洁的软件开发方式

【开源】QuickPager ASP.NET2.0分页控件——使用示例、基本应用和查询功能

    myPage分页控件发出来之后,虽然开源了,但是没有给一个简单一点的 demo,真是漏掉了一个很重要的部分。     先说明一下使用myPage分页...

258100
来自专栏破晓之歌

完全媲美sublime的编辑器-Atom 原

前端可视化插件神器,配合谷歌浏览器一起使用。本质是监控文件修改,实时刷新浏览器,需要安装livereload插件和node.js插件,全局刷新

96730
来自专栏腾讯IVWEB团队的专栏

react native 入门实战(一)

本文举一个简单的例子介绍如何进行 react native 实战开发,主要从以下几个方面来进行介绍:如何在 mac IOS 下进行 react native 环...

1.2K00
来自专栏Zachary46

Android Studio常用快捷键(Mac)

95440
来自专栏陈满iOS

iOS·同一个UIButton可以多次addTarget:添加事件,前面添加的并不会失效

15110
来自专栏青玉伏案

IOS开发之TabBarItem&NavigationBarItem

  想必大家都用过微信,微信间的页面切换是如何做成的呢?接下来我们用storyboard结合着代码来模拟一下微信的视图控制模式。   "工欲善其事,必先利其器"...

21380

扫码关注云+社区

领取腾讯云代金券