AFNetworking 3.0 源碼解讀(十)之 UIActivityIndicatorView/UIRefreshControl/UIImageView + AFNetworking


我們應該看到過很多類似這樣的例子:某個控件擁有加載網絡圖片的能力。但這究竟是怎么做到的呢?看完這篇文章就明白了。

前言

這篇我們會介紹 AFNetworking 中的3個UIKit中的分類。UIActivityIndicatorView UIRefreshControl UIImageView。讀完本篇就能夠明白控件是如何顯示網絡圖片的。那么如果你有興趣,可以嘗試讓一個控件的layer也能夠加載網絡圖片。

提供的功能

我們解讀源碼不僅僅是了解內部實現原理,還要讓開發者明白在這些分類中我能夠使用那些功能,因此在這個 提供的功能 小結中,我會把這3個分類提供的功能羅列出來,即使不看下邊的源碼解讀,也會有所收獲。

  1. UIActivityIndicatorView+AFNetworking UIActivityIndicatorView的這個分類最簡單,它只提供了一個方法:setAnimatingWithStateOfTask: 只要給UIActivityIndicatorView一個 task UIActivityIndicatorView會根據數據的加載情況 自動 開始動畫或者結束動畫。
  2. UIRefreshControl+AFNetworking UIRefreshControl的這個分類的使用跟上邊的UIActivityIndicatorView+AFNetworking一模一樣。
  3. UIImageView+AFNetworking UIImageView是最常用的顯示圖片的控件。額外增加了 placeholderImage(替代圖片) 這個屬性和 success failure 這兩個block來自定義一些事件。最后增加了兩個取消某個狀態下的圖片下載的方法。我們看下邊的圖片就好了:

UIActivityIndicatorView+AFNetworking

This category adds methods to the UIKit framework's UIActivityIndicatorView class. The methods in this category provide support for automatically starting and stopping animation depending on the loading state of a session task.

這個分類增加了UIActivityIndicatorView的一個方法。這個方法能夠提供根據task自動開始和結束動畫的功能

這個分類需要依賴 AFNetworking。需要監聽AFNetworking中的網絡狀態的通知。按照通常的想法是,只要我監聽了通知然后設置自己的狀態就完事了。然而這並不是好的設計。一個控件的某項新的功能應該交給一個專門負責這個功能的人去完成,這才是好的設計。

因此我們給UIActivityIndicatorView擴展了一個屬性af_notificationObserver,這個屬性是專門處理上邊說的事件的管理者。

好吧,我們寫出偽代碼:

- (通知監聽者 *)af_notificationObserver {
    return 通知監聽者;
}
- (void)setAnimatingWithStateOfTask:(NSURLSessionTask *)task {
    監聽者根據task來做一些事;
}

這樣寫的好處是:當我們想擴展別的功能的時候,只需要在添加一個其他功能的負責人就可以,所有的邏輯都是負責人自己實現。這種思想簡直完美。我們看 AFNetworking 中對上邊偽代碼的實現。相信大多數朋友應該知道,往分類中添加屬性使用Runtime,不明白的可以看這篇 Objective-C runtime的常見應用.

- (AFActivityIndicatorViewNotificationObserver *)af_notificationObserver {
    AFActivityIndicatorViewNotificationObserver *notificationObserver = objc_getAssociatedObject(self, @selector(af_notificationObserver));
    if (notificationObserver == nil) {
        notificationObserver = [[AFActivityIndicatorViewNotificationObserver alloc] initWithActivityIndicatorView:self];
        objc_setAssociatedObject(self, @selector(af_notificationObserver), notificationObserver, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
    }
    return notificationObserver;
}

- (void)setAnimatingWithStateOfTask:(NSURLSessionTask *)task {
    [[self af_notificationObserver] setAnimatingWithStateOfTask:task];
}

我們來看看這個af_notificationObserver有什么話要說呢?

  • UIActivityIndicatorView *activityIndicatorView 既然讓我來管理UIActivityIndicatorView,那就必須拿到這個控件才行。
  • initWithActivityIndicatorView: 我不可能憑空出現,通過這個方法創建我。
  • setAnimatingWithStateOfTask: 我就是通過這個方法來操控UIActivityIndicatorView的。

這么看來,這個af_notificationObserver只需要上邊3個東東就足夠了,那么我們就剩下setAnimatingWithStateOfTask:這個方法的實現了。

- (void)setAnimatingWithStateOfTask:(NSURLSessionTask *)task {
    
    NSNotificationCenter *notificationCenter = [NSNotificationCenter defaultCenter];

    // 移除 AFNetworking 的通知
    [notificationCenter removeObserver:self name:AFNetworkingTaskDidResumeNotification object:nil];
    [notificationCenter removeObserver:self name:AFNetworkingTaskDidSuspendNotification object:nil];
    [notificationCenter removeObserver:self name:AFNetworkingTaskDidCompleteNotification object:nil];
    
    // task != nil
    if (task) {
        
        // task的狀態不等於完成
        if (task.state != NSURLSessionTaskStateCompleted) {
            
#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wreceiver-is-weak"
#pragma clang diagnostic ignored "-Warc-repeated-use-of-weak"
            // 狀態為運行中就開始,否則為停止
            if (task.state == NSURLSessionTaskStateRunning) {
                [self.activityIndicatorView startAnimating];
            } else {
                [self.activityIndicatorView stopAnimating];
            }
#pragma clang diagnostic pop

            // 移除 AFNetworking 的通知
            [notificationCenter addObserver:self selector:@selector(af_startAnimating) name:AFNetworkingTaskDidResumeNotification object:task];
            [notificationCenter addObserver:self selector:@selector(af_stopAnimating) name:AFNetworkingTaskDidCompleteNotification object:task];
            [notificationCenter addObserver:self selector:@selector(af_stopAnimating) name:AFNetworkingTaskDidSuspendNotification object:task];
        }
    }
}

#pragma mark -

- (void)af_startAnimating {
    dispatch_async(dispatch_get_main_queue(), ^{
#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wreceiver-is-weak"
        [self.activityIndicatorView startAnimating];
#pragma clang diagnostic pop
    });
}

- (void)af_stopAnimating {
    dispatch_async(dispatch_get_main_queue(), ^{
#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wreceiver-is-weak"
        [self.activityIndicatorView stopAnimating];
#pragma clang diagnostic pop
    });
}

UIImageView+AFNetworking

我們在 AFImageDownloader 那篇文章中提到過,要異步顯示網絡上的圖片,就要把圖片數據緩存下來才行。因此,要賦予UIImageView這項功能,就需要使用 AFImageDownloader 來獲取圖片數據。

不知道大家發現沒有,像這張圖片中的這些方法,,我們只需要實現參數最多的那個方法就行了。這應該就是所謂的 尾調函數 吧。

首先我們先看看UIImageView擴展的一個屬性af_activeImageDownloadReceipt,這個屬性是圖片依據

@interface UIImageView (_AFNetworking)
@property (readwrite, nonatomic, strong, setter = af_setActiveImageDownloadReceipt:) AFImageDownloadReceipt *af_activeImageDownloadReceipt;
@end

@implementation UIImageView (_AFNetworking)

- (AFImageDownloadReceipt *)af_activeImageDownloadReceipt {
    return (AFImageDownloadReceipt *)objc_getAssociatedObject(self, @selector(af_activeImageDownloadReceipt));
}

- (void)af_setActiveImageDownloadReceipt:(AFImageDownloadReceipt *)imageDownloadReceipt {
    objc_setAssociatedObject(self, @selector(af_activeImageDownloadReceipt), imageDownloadReceipt, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

通過運行時為@selector(af_activeImageDownloadReceipt) 設置了關聯值,同樣的原理。 sharedImageDownloader 也是這么設置的

+ (AFImageDownloader *)sharedImageDownloader {

#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wgnu"
    return objc_getAssociatedObject(self, @selector(sharedImageDownloader)) ?: [AFImageDownloader defaultInstance];
#pragma clang diagnostic pop
}

+ (void)setSharedImageDownloader:(AFImageDownloader *)imageDownloader {
    objc_setAssociatedObject(self, @selector(sharedImageDownloader), imageDownloader, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

在這里說下這個objc_setAssociatedObject方法,其中第二個參數是一個地址,因此我們可以用@selector
或者自定義一個全局的const字段,取它的地址。 看下邊的例子,我為UIImageView擴展了一個屬性abc。

static const NSString *abcde;

@interface UIImageView (_AFNetworking)
@property (readwrite, nonatomic, strong, setter = af_setActiveImageDownloadReceipt:) AFImageDownloadReceipt *af_activeImageDownloadReceipt;
@property (readwrite, nonatomic, strong)NSString *abc;
@end

@implementation UIImageView (_AFNetworking)

- (AFImageDownloadReceipt *)af_activeImageDownloadReceipt {
    return (AFImageDownloadReceipt *)objc_getAssociatedObject(self, @selector(af_activeImageDownloadReceipt));
}

- (void)af_setActiveImageDownloadReceipt:(AFImageDownloadReceipt *)imageDownloadReceipt {
    objc_setAssociatedObject(self, @selector(af_activeImageDownloadReceipt), imageDownloadReceipt, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

- (void)setAbc:(NSString *)abc {
    objc_setAssociatedObject(self, &abcde, abc, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}
- (NSString *)abc {
    return objc_getAssociatedObject(self, &abcde);
}

我在使用的時候

UIImageView *imageView = [[UIImageView alloc] init];
[imageView setValue:@"qwer" forKey:@"abc"];

NSString *str = [imageView valueForKey:@"abc"];
NSLog(@"%@",str);

--

- (void)cancelImageDownloadTask {
    if (self.af_activeImageDownloadReceipt != nil) {
        [[self.class sharedImageDownloader] cancelTaskForImageDownloadReceipt:self.af_activeImageDownloadReceipt];
        [self clearActiveDownloadInformation];
     }
}

- (void)clearActiveDownloadInformation {
    self.af_activeImageDownloadReceipt = nil;
}

- (BOOL)isActiveTaskURLEqualToURLRequest:(NSURLRequest *)urlRequest {
    return [self.af_activeImageDownloadReceipt.task.originalRequest.URL.absoluteString isEqualToString:urlRequest.URL.absoluteString];
}

來看這個核心方法,處理手法和之前的代碼如出一轍,值得學習的是,核心方法中的判斷比較詳細。

- (void)setImageWithURLRequest:(NSURLRequest *)urlRequest
              placeholderImage:(UIImage *)placeholderImage
                       success:(void (^)(NSURLRequest *request, NSHTTPURLResponse * _Nullable response, UIImage *image))success
                       failure:(void (^)(NSURLRequest *request, NSHTTPURLResponse * _Nullable response, NSError *error))failure
{

    // urlRequest 不正確
    if ([urlRequest URL] == nil) {
        // 取消下載任務
        [self cancelImageDownloadTask];
        // 賦值替代圖片
        self.image = placeholderImage;
        return;
    }

    // 如果當前活動的下載和本下載一樣,就返回
    if ([self isActiveTaskURLEqualToURLRequest:urlRequest]){
        return;
    }

    // 取消之前的下載任務
    [self cancelImageDownloadTask];

    // 取出downloader
    AFImageDownloader *downloader = [[self class] sharedImageDownloader];
    // 取出緩存
    id <AFImageRequestCache> imageCache = downloader.imageCache;

    //Use the image from the image cache if it exists
    UIImage *cachedImage = [imageCache imageforRequest:urlRequest withAdditionalIdentifier:nil];
    if (cachedImage) {
        
        // 如果寫了success Block 就調動block,但不會給image賦值
        if (success) {
            success(urlRequest, nil, cachedImage);
        } else {
            self.image = cachedImage;
        }
        [self clearActiveDownloadInformation];
    } else {
        
        // 沒有緩存的話,先設置替代圖片
        if (placeholderImage) {
            self.image = placeholderImage;
        }

        __weak __typeof(self)weakSelf = self;
        NSUUID *downloadID = [NSUUID UUID];
        AFImageDownloadReceipt *receipt;
        receipt = [downloader
                   downloadImageForURLRequest:urlRequest
                   withReceiptID:downloadID
                   success:^(NSURLRequest * _Nonnull request, NSHTTPURLResponse * _Nullable response, UIImage * _Nonnull responseObject) {
                       __strong __typeof(weakSelf)strongSelf = weakSelf;
                       if ([strongSelf.af_activeImageDownloadReceipt.receiptID isEqual:downloadID]) {
                           if (success) {
                               success(request, response, responseObject);
                           } else if(responseObject) {
                               strongSelf.image = responseObject;
                           }
                           [strongSelf clearActiveDownloadInformation];
                       }

                   }
                   failure:^(NSURLRequest * _Nonnull request, NSHTTPURLResponse * _Nullable response, NSError * _Nonnull error) {
                       __strong __typeof(weakSelf)strongSelf = weakSelf;
                        if ([strongSelf.af_activeImageDownloadReceipt.receiptID isEqual:downloadID]) {
                            if (failure) {
                                failure(request, response, error);
                            }
                            [strongSelf clearActiveDownloadInformation];
                        }
                   }];

        self.af_activeImageDownloadReceipt = receipt;
    }
}

方法不是最重要的,重要是梳理出這一整套的邏輯和想法,下面我們就來分析分析。

  1. 首先我們規定,使用這個分類每加載一次圖片生成一個af_activeImageDownloadReceipt憑據,這個憑據一旦下載完成后,需要置為nil。
  2. 我們使用上邊的這個最長的方法來加載圖片。
  3. 我們先判斷這個urlRequest是不是有效的。有效就繼續往下走,無效的話取消之前的下載,然后賦值替代圖片。說明如果urlRequest失效,同時也取消了之前的下載
  4. 好,到這里,說明urlRequest是正確的,那么我們再判斷是不是現在下載的跟之前正在下載的URL是一樣的?存在這樣一種操作,我寫了兩個上邊的方法
  5. 這一步要取消之前的下載任務
  6. 在緩存中取圖片,如果圖片存在,那么再看看是否設置了success,設置了就調用這個block,否則就使用替代圖片。
  7. 請求失敗處理方法同上邊6.一樣。

總結

通過對上邊的方法的解讀,我們就很容易的給別的控件添加異步加載功能了。使用上邊的方法且改動很少的代碼就能完成。

推薦閱讀

AFNetworking 3.0 源碼解讀(一)之 AFNetworkReachabilityManager

AFNetworking 3.0 源碼解讀(二)之 AFSecurityPolicy

AFNetworking 3.0 源碼解讀(三)之 AFURLRequestSerialization

AFNetworking 3.0 源碼解讀(四)之 AFURLResponseSerialization

AFNetworking 3.0 源碼解讀(五)之 AFURLSessionManager

AFNetworking 3.0 源碼解讀(六)之 AFHTTPSessionManager

AFNetworking 3.0 源碼解讀(七)之 AFAutoPurgingImageCache

AFNetworking 3.0 源碼解讀(八)之 AFImageDownloader

AFNetworking 3.0 源碼解讀(九)之 AFNetworkActivityIndicatorManager


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM