加載網絡圖片可以說是網絡應用中必備的。如果單純的去下載圖片，而不去做多線程、緩存等技術去優化，加載圖片時的效果與用戶體驗就會很差。
一、自己實現加載圖片的方法
tips：
*iOS中所有網絡訪問都是異步的.(自己開線程去下載)
*普通爲模型增加UIImage屬性的方法做的是內存緩存(下次啓動還需要從網絡重新加載),
而要做本地緩存的話,還要自己手動存儲網絡上下載的圖片.
*爲了加快訪問, 還需要自己去弄緩存.(內存緩存或者本地緩存)
*當圖片沒有下載完成時，還要設置佔位圖片。
以下代碼用NSOperation開異步線程下載圖片，當下載完成時替換佔位圖片。
//
// XNViewController.m
// 加載網絡圖片, 普通的用NSOperation來做.
//
// Created by neng on 14-7-7.
// Copyright (c) 2014年 neng. All rights reserved.
//
#import "XNViewController.h"
#import "XNApp.h"
@interface XNViewController ()
@property (nonatomic, strong) NSArray *appList;
@property (nonatomic, strong) NSOperationQueue *queue;
@end
@implementation XNViewController
#pragma mark - 懶加載
- (NSOperationQueue *)queue {
if (!_queue) _queue = [[NSOperationQueue alloc] init];
return _queue;
}
//可抽取出來寫到模型中
- (NSArray *)appList {
if (!_appList) {
//1.加載plist到數組中
NSURL *url = [[NSBundle mainBundle] URLForResource:@"apps.plist" withExtension:nil];
NSArray *array = [NSArray arrayWithContentsOfURL:url];
//2.遍歷數組
NSMutableArray *arrayM = [NSMutableArray array];
[array enumerateObjectsUsingBlock: ^(id obj, NSUInteger idx, BOOL *stop) {
[arrayM addObject:[XNApp appWithDict:obj]]; //數組中存放的是字典, 轉換爲app對象後再添加到數組
}];
_appList = [arrayM copy];
}
return _appList;
}
- (void)viewDidLoad {
[super viewDidLoad];
self.tableView.rowHeight = 88;
// NSLog(@"appList-%@",_appList);
}
#pragma mark - 數據源方法
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return self.appList.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *ID = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
//用模型來填充每個cell
XNApp *app = self.appList[indexPath.row];
cell.textLabel.text = app.name; //設置文字
//設置圖像: 模型中圖像爲nil時用默認圖像,並下載圖像. 否則用模型中的內存緩存圖像.
if (!app.image) {
cell.imageView.image = [UIImage imageNamed:@"user_default"];
[self downloadImg:indexPath];
}
else {
//直接用模型中的內存緩存
cell.imageView.image = app.image;
}
// NSLog(@"cell--%p", cell);
return cell;
}
/**始終記住, 通過模型來修改顯示. 而不要試圖直接修改顯示*/
- (void)downloadImg:(NSIndexPath *)indexPath {
XNApp *app = self.appList[indexPath.row]; //取得改行對應的模型
[self.queue addOperationWithBlock: ^{
NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString:app.icon]]; //得到圖像數據
UIImage *image = [UIImage imageWithData:imgData];
//在主線程中更新UI
[[NSOperationQueue mainQueue] addOperationWithBlock: ^{
//通過修改模型, 來修改數據
app.image = image;
//刷新指定表格行
[self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
}];
}];
}
@end
二、使用第三方框架SDWebImage。（非常優秀）
*特點 :依賴的庫很少.功能全面。
*自動實現磁盤緩存:
*緩存圖片名字是以MD5進行加密的後的名字進行命名.(因爲加密那堆字串是唯一的)
*[imageViewsd_setImageWithURL:v.fullImageURL placeholderImage:[UIImage imageNamed:@”xxxxx”]].
*就一個方法就實現了多線程\帶緩衝等效果.(可用帶參數的方法,具體可看頭文件)
用SDWebImage修改上面的方法後的代碼可簡化爲：
#pragma mark - 數據源方法
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return self.appList.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *ID = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
//用模型來填充每個cell
XNApp *app = self.appList[indexPath.row];
cell.textLabel.text = app.name; //設置文字
// //設置圖像: 模型中圖像爲nil時用默認圖像,並下載圖像. 否則用模型中的內存緩存圖像.
// if (!cell.imageView.image) {
// cell.imageView.image = [UIImage imageNamed:@"user_default"];
//
// [self downloadImg:indexPath];
// }
// else {
// //直接用模型中的內存緩存
// cell.imageView.image = app.image;
// }
//使用SDWebImage來完成上面的功能. 針對ImageView.
//一句話, 自動實現了異步下載. 圖片本地緩存. 網絡下載. 自動設置佔位符.
[cell.imageView sd_setImageWithURL:[NSURL URLWithString:app.icon] placeholderImage:[UIImage imageNamed:@"user_default"]];
return cell;
}
/**始終記住, 通過模型來修改顯示. 而不要試圖直接修改顯示*/
//- (void)downloadImg:(NSIndexPath *)indexPath {
// XNApp *app = self.appList[indexPath.row]; //取得改行對應的模型
//
// [self.queue addOperationWithBlock: ^{
// NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString:app.icon]]; //得到圖像數據
// UIImage *image = [UIImage imageWithData:imgData];
//
// //在主線程中更新UI
// [[NSOperationQueue mainQueue] addOperationWithBlock: ^{
// //通過修改模型, 來修改數據
// app.image = image;
// //刷新指定表格行
// [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
// }];
// }];
//}
@endSDWebImage中的一些參數：
*SDWebImageRetryFailed = 1<< 0, 默認選項，失敗後重試
*SDWebImageLowPriority = 1<< 1, 使用低優先級
*SDWebImageCacheMemoryOnly = 1<< 2, 僅僅使用內存緩存
*SDWebImageProgressiveDownload = 1<< 3, 顯示現在進度
*SDWebImageRefreshCached = 1<< 4, 刷新緩存
*SDWebImageContinueInBackground =1 << 5, 後臺繼續下載圖像
*SDWebImageHandleCookies = 1<< 6, 處理Cookie
*SDWebImageAllowInvalidSSLCertificates= 1 << 7, 允許無效的SSL驗證
*SDWebImageHighPriority = 1<< 8, 高優先級
*SDWebImageDelayPlaceholder = 1<< 9 延遲顯示佔位圖片