前言
開發iOS有一段時間了，平時工作中主要還是完成業務功能。類似網絡請求，圖片加載等等都直接使用現成的開源類庫，項目主要還是以穩定為先。
但長期這樣感覺難以進步，想要進階除了看書外就得多看看開源類庫的源碼了。
于是就從SDWebImage入手，在深入學習后發現它的代碼各層職責分工明確，代碼量也不是很多，利用業余時間斷斷續續學習花費了大約三周時間，感覺比較適合作為第一個供學習的開源類庫。
大致涉及到的知識點:
- Block
- GCD
- NSOperation
- Associated Objects
- NSURLRequest
- NSCache
- 圖片類型識別與處理
文章中難免出現問題，望各位給予糾正，有問題歡迎一起討論。
源碼分析
SDWebImage使用起來非常簡單，只需調用sd_setImageWithURL方法,就可以將圖片異步的加載并顯示在UIImageView上。
所以接下來我們就從sd_setImageWithURL開始說起：
NSURL * url = [NSURL URLWithString:@"http://hbimg.b0.upaiyun.com/ddd2cee8ff21d4a09a86b68972b78b15ba7bc2a035fa4-sGYzEJ_fw658"];
[imageView sd_setImageWithURL:url];
上面代碼所使用的是sd_setImageWithURL最簡單的版本，我們跟進去看一下，發現方法里其實幫我們設置好了默認參數，最終調用到的是另一個方法：
- (void)sd_setImageWithURL:(NSURL *)url {
[self sd_setImageWithURL:url placeholderImage:nil options:0 progress:nil completed:nil];
}
我們跟進去看看，通過注釋可以得知這個方法的用途：
/**
* ?根據url給imageView設置image，占位圖和各種自定義設置
*
* 使用異步下載和緩存
*
* @param url 圖片的url
* @param placeholder 占位圖
* @param options 下載圖片時的各種設置. @see SDWebImageOptions.
* @param progressBlock 當圖片正在下載時會被回調到
* @param completedBlock 當任務完成時會被回調到 。該block沒有返回值使用UIImage作為第一個參數
* 如果下載中出現錯誤UIIMage為nil并且第二個參數會包含NSError
* 第三個參數是一個枚舉(*原注釋這塊寫的是布爾值)，表示圖片是從本地緩存中還是網絡中取回的
* 第四個參數是原生的image url
*/
- (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options progress:(SDWebImageDownloaderProgressBlock)progressBlock completed:(SDWebImageCompletionBlock)completedBlock;
//completedBlock，參數與注釋對應
typedef void(^SDWebImageCompletionBlock)(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL);
接著我們看代碼，然后一步步分析：
- (void)sd_setImageWithURL:(NSURL *)url placeholderImage:(UIImage *)placeholder options:(SDWebImageOptions)options progress:(SDWebImageDownloaderProgressBlock)progressBlock completed:(SDWebImageCompletionBlock)completedBlock {
//取消當前UIImageView正在加載的圖片任務
[self sd_cancelCurrentImageLoad];
//相當于給當前UIImageView對象上綁定圖片url屬性
objc_setAssociatedObject(self, &imageURLKey, url, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
//如果options中沒有傳入SDWebImageDelayPlaceholder參數，則設置占位圖
//這里出現了dispatch_main_async_safe，其實是SDWebImage定義的宏,其實就是將UI操作放入主線程中用的
if (!(options & SDWebImageDelayPlaceholder)) {
dispatch_main_async_safe(^{
self.image = placeholder;
});
}
if (url) {
// 檢查是否打開了"會轉動的菊花"選項
if ([self showActivityIndicatorView]) {
[self addActivityIndicator]; //< 界面上會出現轉動的菊花
}
__weak __typeof(self)wself = self;
//從方法名中可以猜出它是用來下載圖片用的，目前只需要這么理解就好，后面章節會具體談到
id <SDWebImageOperation> operation = [SDWebImageManager.sharedManager downloadImageWithURL:url options:options progress:progressBlock completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
[wself removeActivityIndicator]; //<將轉動的菊花從界面上移除
if (!wself) return;
dispatch_main_sync_safe(^{
if (!wself) return;
//設置了SDWebImageAvoidAutoSetImage參數時，默認不會將image添加進UIViewImage對象，而是放置到completedBlock中交由調用方自己處理，比如做個濾鏡或者添加淡出淡入效果什么的
if (image && (options & SDWebImageAvoidAutoSetImage) && completedBlock)
{
completedBlock(image, error, cacheType, url);
return;
}
else if (image) {
wself.image = image; //< 設置image
[wself setNeedsLayout];
} else { //< 當image為nil
if ((options & SDWebImageDelayPlaceholder)) {
wself.image = placeholder;//< 此時再將占位圖設置進去
[wself setNeedsLayout];
}
}
if (completedBlock && finished) {
completedBlock(image, error, cacheType, url);
}
});
}];
//保存本次operation，如果發生多次圖片請求加載可以用來取消
//先取消當前UIImageView正在加載的任務，再保存operation
[self sd_setImageLoadOperation:operation forKey:@"UIImageViewImageLoad"];
} else {
dispatch_main_async_safe(^{
[self removeActivityIndicator];
if (completedBlock) {
NSError *error = [NSError errorWithDomain:SDWebImageErrorDomain code:-1 userInfo:@{NSLocalizedDescriptionKey : @"Trying to load a nil url"}];
completedBlock(nil, error, SDImageCacheTypeNone, url);
}
});
}
}
這里先提幾個點：
1.在代碼中我們會發現有dispatch_main_async_safe這么一個神奇的東東，其實它是SDWebImage定義的宏，將UI操作放入主線程中用的：
#define dispatch_main_async_safe(block)
if ([NSThread isMainThread]) { //< 如果當前在主線程中
block();
} else { //< 不在主線程就將它放入主線程
dispatch_async(dispatch_get_main_queue(), block);
}
2.代碼中偶爾會出現objc_setAssociatedObject，簡單的說使用該技巧可以很方便的將變量動態綁定在該實例下，原因在于Category中是不允許添加實例變量。
回到主題來，代碼在請求下載圖片前執行了[self sd_cancelCurrentImageLoad]，從方法名上可以猜出它的大意“取消當前圖片的加載”，他是作什么用的呢，為什么在加載圖片前會需要用到取消這么一個方法？帶著疑問我們繼續，發現調用了另一個方法，看來這里只負責傳入對應的“key”
- (void)sd_cancelCurrentImageLoad {
[self sd_cancelImageLoadOperationWithKey:@"UIImageViewImageLoad"];
}
再跟進來我們可以看到具體的實現了
- (void)sd_cancelImageLoadOperationWithKey:(NSString *)key {
//利用AssociatedObject維護的字典，用于存放當前任務中的operation(圖片請求)
NSMutableDictionary *operationDictionary = [self operationDictionary];
//key為"UIImageViewImageLoad"
id operations = [operationDictionary objectForKey:key];
if (operations) { //< 當前有正在執行的operation，需要取消任務
//多個operation的是gif(多幀)，單個的是普通圖片
if ([operations isKindOfClass:[NSArray class]]) {
for (id <SDWebImageOperation> operation in operations) {
if (operation) {
[operation cancel]; //< 取消
}
}
} else if ([operations conformsToProtocol:@protocol(SDWebImageOperation)]){
[(id<SDWebImageOperation>) operations cancel]; //< 取消
}
//刪除對應key的對象
//每次對應UIView有一個圖片請求的任務時，都會設置對應的key，所以可以根據這個key來判斷是否有正在執行的任務
[operationDictionary removeObjectForKey:key];
}
}
看完上面這段代碼后，我們大致有了一個概念，同時也發現這兩段代碼的“key”是一樣的：
//取消當前UIImageView正在加載的圖片任務
[self sd_cancelCurrentImageLoad];
...
//保存本次operation，如果發生多次圖片請求加載可以用來取消
//先取消當前UIImageView正在加載的任務，再保存operation
[self sd_setImageLoadOperation:operation forKey:@"UIImageViewImageLoad"];
再回到剛才的疑問，舉個例子來說就能明白方法的意圖和具體流程了：
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 50, 50)];
[imageView sd_setImageWithURL:[NSURL URLWithString:@"http://www.example.com/1.png"] placeholderImage:nil];
[imageView sd_setImageWithURL:[NSURL URLWithString:@"http://www.example.com/2.png"] placeholderImage:nil];
一個imageView請求了兩張圖片，1.png 和 2.png，但我們只希望顯示 2.png，所以需要取消 1.png的請求。原因有兩點：
1.在異步請求中（先后順序不定），有可能 1.png 會在 2.png 后面獲取到，會覆蓋掉2.png
2.減少網絡請求，網絡請求是一個很耗時的操作
