IOS開(kāi)發(fā)中加載大量網(wǎng)絡(luò)圖片如何優(yōu)化
1、概述
在IOS下通過(guò)URL讀一張網(wǎng)絡(luò)圖片并不像其他編程語(yǔ)言那樣可以直接把圖片路徑放到圖片路徑的位置就ok,而是需要我們通過(guò)一段類(lèi)似流的方式去加載網(wǎng)絡(luò)圖片,接著才能把圖片放入圖片路徑顯示。比如:
-(UIImage *) getImageFromURL:(NSString *)fileURL { //NSLog(@"執(zhí)行圖片下載函數(shù)"); UIImage * result; NSData * data = [NSData dataWithContentsOfURL:[NSURL URLWithString:fileURL]]; result = [UIImage imageWithData:data]; return result;}加載網(wǎng)絡(luò)圖片可以說(shuō)是網(wǎng)絡(luò)應(yīng)用中必備的。如果單純的去下載圖片,而不去做多線(xiàn)程、緩存等技術(shù)去優(yōu)化,加載圖片時(shí)的效果與用戶(hù)體驗(yàn)就會(huì)很差。
優(yōu)化思路為:
(1)本地緩存
(2)異步加載
(3)加載完畢前使用占位圖片
2、優(yōu)化方法
方法1:用NSOperation開(kāi)異步線(xiàn)程下載圖片,當(dāng)下載完成時(shí)替換占位圖片
#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;}//可抽取出來(lái)寫(xiě)到模型中- (NSArray *)appList { if (!_appList) { //1.加載plist到數(shù)組中 NSURL *url = [[NSBundle mainBundle] URLForResource:@"apps.plist" withExtension:nil]; NSArray *array = [NSArray arrayWithContentsOfURL:url]; //2.遍歷數(shù)組 NSMutableArray *arrayM = [NSMutableArray array]; [array enumerateObjectsUsingBlock: ^(id obj, NSUInteger idx, BOOL *stop) { [arrayM addObject:[XNApp appWithDict:obj]]; //數(shù)組中存放的是字典, 轉(zhuǎn)換為app對(duì)象后再添加到數(shù)組 }]; _appList = [arrayM copy]; } return _appList;}- (void)viewDidLoad { [super viewDidLoad]; self.tableView.rowHeight = 88;// NSLog(@"appList-%@",_appList);}#pragma mark - 數(shù)據(jù)源方法- (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]; //用模型來(lái)填充每個(gè)cell XNApp *app = self.appList[indexPath.row]; cell.textLabel.text = app.name; //設(shè)置文字 //設(shè)置圖像: 模型中圖像為nil時(shí)用默認(rèn)圖像,并下載圖像. 否則用模型中的內(nèi)存緩存圖像. if (!app.image) { cell.imageView.image = [UIImage imageNamed:@"user_default"]; [self downloadImg:indexPath]; } else { //直接用模型中的內(nèi)存緩存 cell.imageView.image = app.image; }// NSLog(@"cell--%p", cell); return cell;}/**始終記住, 通過(guò)模型來(lái)修改顯示. 而不要試圖直接修改顯示*/- (void)downloadImg:(NSIndexPath *)indexPath { XNApp *app = self.appList[indexPath.row]; //取得改行對(duì)應(yīng)的模型 [self.queue addOperationWithBlock: ^{ NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString:app.icon]]; //得到圖像數(shù)據(jù) UIImage *image = [UIImage imageWithData:imgData]; //在主線(xiàn)程中更新UI [[NSOperationQueue mainQueue] addOperationWithBlock: ^{ //通過(guò)修改模型, 來(lái)修改數(shù)據(jù) app.image = image; //刷新指定表格行 [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone]; }]; }];}@end上述代碼只是做了內(nèi)存緩存,還沒(méi)有做本地緩存,因?yàn)檫@里這種方法不是重點(diǎn),也不是首選方法。上面代碼每次重新進(jìn)入應(yīng)用時(shí),還會(huì)從網(wǎng)上重新下載。如果要繼續(xù)優(yōu)化上面的代碼,需要自己去實(shí)現(xiàn)本地緩存。
方法2:使用第三方框架SDWebImage
特點(diǎn):
依賴(lài)的庫(kù)很少,功能全面。
自動(dòng)實(shí)現(xiàn)磁盤(pán)緩存:緩存圖片名字是以MD5進(jìn)行加密的后的名字進(jìn)行命名.(因?yàn)榧用苣嵌炎执俏ㄒ坏?
加載網(wǎng)絡(luò)圖片時(shí)直接設(shè)置占位圖片:[imageView sd_setImageWithURL:imageurl placeholderImage:[UIImage imageNamed:@”xxxxx”]]。
就一個(gè)方法就實(shí)現(xiàn)了多線(xiàn)程/帶緩沖等效果.(可用帶參數(shù)的方法,具體可看頭文件)
用SDWebImage修改上面的方法后的代碼可簡(jiǎn)化為:
#pragma mark - 數(shù)據(jù)源方法- (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]; //用模型來(lái)填充每個(gè)cell XNApp *app = self.appList[indexPath.row]; cell.textLabel.text = app.name; //設(shè)置文字// //設(shè)置圖像: 模型中圖像為nil時(shí)用默認(rèn)圖像,并下載圖像. 否則用模型中的內(nèi)存緩存圖像.// if (!cell.imageView.image) {// cell.imageView.image = [UIImage imageNamed:@"user_default"];//// [self downloadImg:indexPath];// }// else {// //直接用模型中的內(nèi)存緩存// cell.imageView.image = app.image;// } //使用SDWebImage來(lái)完成上面的功能. 針對(duì)ImageView. //一句話(huà), 自動(dòng)實(shí)現(xiàn)了異步下載. 圖片本地緩存. 網(wǎng)絡(luò)下載. 自動(dòng)設(shè)置占位符. [cell.imageView sd_setImageWithURL:[NSURL URLWithString:app.icon] placeholderImage:[UIImage imageNamed:@"user_default"]]; return cell;}/**始終記住, 通過(guò)模型來(lái)修改顯示. 而不要試圖直接修改顯示*///- (void)downloadImg:(NSIndexPath *)indexPath {// XNApp *app = self.appList[indexPath.row]; //取得改行對(duì)應(yīng)的模型//// [self.queue addOperationWithBlock: ^{// NSData *imgData = [NSData dataWithContentsOfURL:[NSURL URLWithString:app.icon]]; //得到圖像數(shù)據(jù)// UIImage *image = [UIImage imageWithData:imgData];//// //在主線(xiàn)程中更新UI// [[NSOperationQueue mainQueue] addOperationWithBlock: ^{// //通過(guò)修改模型, 來(lái)修改數(shù)據(jù)// app.image = image;// //刷新指定表格行// [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];// }];// }];//}@end【備注】SDWebImage中的一些參數(shù):
*SDWebImageRetryFailed = 1<< 0, 默認(rèn)選項(xiàng),失敗后重試*SDWebImageLowPriority = 1<< 1, 使用低優(yōu)先級(jí)*SDWebImageCacheMemoryOnly = 1<< 2, 僅僅使用內(nèi)存緩存*SDWebImageProgressiveDownload = 1<< 3, 顯示現(xiàn)在進(jìn)度*SDWebImageRefreshCached = 1<< 4, 刷新緩存*SDWebImageContinueInBackground =1 << 5, 后臺(tái)繼續(xù)下載圖像*SDWebImageHandleCookies = 1<< 6, 處理Cookie*SDWebImageAllowInvalidSSLCertificates= 1 << 7, 允許無(wú)效的SSL驗(yàn)證*SDWebImageHighPriority = 1<< 8, 高優(yōu)先級(jí)*SDWebImageDelayPlaceholder = 1<< 9 延遲顯示占位圖片
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注