一 多图下载实现功能图
二 案例涉及到问题
01 字典转模型
02 图片重复下载—>内存缓存,沙盒缓存处理
03 UI不流畅—>开子线程下载图片(注意线程间通信)
04 图片下载任务被添加到队列中多次—>操作缓存处理
05 图片下载后不显示问题—>主动刷新指定行
06 图片加载中出现数据错乱问题—>设置占位图片
07 在程序开发过程中的一些容错处理
三 针对下载的图片处理思路
四 代码部分
1 模型我这里就不过多的解释了,直接用KVC就能解决
2 主要针对每行cell中的图片处理
2.1 cell内容的前部分
static NSString *ID = @"cell"
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID]
XFAppItem *item = self.arrayApps[indexPath.row]
//每行的标题
cell.textLabel.text = item.name
//每行的下载次数
cell.detailTextLabel.text = item.download
2.2 检查内存中是否存有已经下载好的图片,有的话就直接用内存的
UIImage *image = [self.images objectForKey:item.icon];
if (image) {
cell.imageView.image = image;
}else{
2.3 检查磁盘,看磁盘中是相应的图片
NSString *cachesPath = [NSSearchPathForDirectoriesInDomains(NSApplicationDirectory, NSUserDomainMask, YES)lastObject];
NSString *fileName = [item.icon lastPathComponent];
NSString *fullPath = [cachesPath stringByAppendingPathComponent:fileName];
NSData *data = [NSData dataWithContentsOfFile:fullPath];
2.4 如果磁盘中有存有的图片,那么就用磁盘里的,并且将图片保存到内存当中
if (data) {
UIImage *image = [UIImage imageWithData:data];
cell.imageView.image = image;
[self.images setObject:image forKey:item.icon];
}else{
2.5 尝试着去取下缓存,看是否图片正在缓存,如果正在缓存,那么就不在另外缓存同样的图片了,if语句里面就什么都不做.但是不一定能取到
NSBlockOperation *downloadOperation = [self.operations objectForKey:item.icon];
if (downloadOperation) {
}else{
2.6 如果没有相应的图片在缓存,那么就让相应的图片缓存.开启子线程用于缓存下载图片,然后把图片保存到磁盘和内存
downloadOperation = [NSBlockOperation blockOperationWithBlock:^{
NSURL *url = [NSURL URLWithString:item.icon];
NSData *data = [NSData dataWithContentsOfURL:url];
for (NSInteger i = 0; i < 10000000; i++) {
}
UIImage *image = [UIImage imageWithData:data];
NSLog(@"1--------%@",[NSThread currentThread]);
[self.images setObject:image forKey:item.icon];
[data writeToFile:fullPath atomically:YES];
2.7 显示图片,这是属于显示UI界面,那么这种操作我们一般都是放到主线程中进行,回到主线程,刷新当前的cell
[[NSOperationQueue mainQueue] addOperationWithBlock:^{
// cell.imageView.image = image;
[tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationTop];
NSLog(@"%@-----------2",[NSThread currentThread]);
}];
}]
2.8 对缓存的一些操作,然后返回一个cell
[self.operations setObject:downloadOperation forKey:item.icon];
[self.queue addOperation:downloadOperation];
2.9 最后设置一个图片占位符.理由是因为当网速没有那么快的时候,只显示出来了标题和下载量,并没有图片,那样给用户的感觉不好,所以我们在图片还没有刷新出来之前先设置每一行cell的图片占位符.
代码写在2.5点的代码段上面
cell.imageView.image = [UIImage imageNamed:@"/Users/xiaofeng/Desktop/Snip20160316_1.png"];
五 解决的问题(主要问题)
1 UI界面卡顿
2 图片重复下载
3 用户每次滑动都会下载图片—–费流量
4 图片错乱
六 总结
本段代码逻辑很简单,就是可能代码写起来不是很流畅,大家多写几遍就可以了.有什么疑问,可以给我留言,谢谢!!!!