cell下载图片的思路 --无沙盒（内存）缓冲

时间：2024-08-06 11:37:08
//

//  ViewController.m

//  06-表格图片下载

//

//  Created by jerry on 15/9/7.

//  Copyright (c) 2015年 jerry. All rights reserved.

//

/**

 *  代码重构

 *

 *  目的：1.如果代码太长，如果有一部分专门解决某一个问题，就单拿出来

 *  写的时候，如果思路清晰，能够一次性写完，但是也要注意重构

 *  时间长了，不好阅读

 *  重构代码，便于维护

 *

 *  重构的方法：

 *  如果有一部分代码专门解决某一个问题 ，就单拿出来

 *  1.新建一个方法-->单一功能拿出来

 *  2.参数-->需要传参数

 *  3.在原来的代码地方调用，抽取的方法。

 *  4.注意测试。

 *  5.注意if嵌套，在实际开发中，非常忌讳很深的嵌套，能优化的话最好优化，

 */

#import "ViewController.h"

#import "ZPApp.h"

@interface ViewController ()

// PLIST 文件数据容器

@property(nonatomic,copy)NSArray *appList;

// 全局队列

@property(nonatomic,strong)NSOperationQueue  *opQueue;

// 缓冲池 所有下载操作的缓冲池

@property(nonatomic,strong)NSMutableDictionary *operationCache;

// 所有图片的缓存

@property(nonatomic,strong)NSMutableDictionary *imageCache;

@end

@implementation ViewController

-(NSMutableDictionary *)imageCache

{

    if (_imageCache == nil) {

        _imageCache = [NSMutableDictionary dictionary];

    }

    return _imageCache;

}

-(NSMutableDictionary *)operationCache

{

    if (_operationCache == nil) {

        _operationCache = [NSMutableDictionary dictionary];

    }

    return _operationCache;

}

-(NSOperationQueue *)opQueue

{

    if (_opQueue == nil) {

        _opQueue = [[NSOperationQueue alloc]init];

    }

    return _opQueue;

}

 -(NSArray *)appList

{

    if (_appList == nil) {

        //获取文件路径

        NSString *str = [[NSBundle mainBundle]pathForResource:@"apps.plist" ofType:nil];

        NSArray *fileArray = [NSArray arrayWithContentsOfFile:str];

        NSMutableArray *muArray = [NSMutableArray array];

        for ( NSDictionary *dict in fileArray) {

            ZPApp *app = [ZPApp appWithDict:dict];

            [muArray addObject:app];

        }

        _appList = muArray;

    }

    return _appList;

}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

    return  self.appList.count;

}

/**

 *  CELL里面的imageview属于懒加载

 *  问题1：如果网络比较慢，会比较卡

 *  解决办法：用异步下载

 *

 *  问题2:imageview没有frame

 *  解决办法：使用一个占位图，异步下载完成以后，不显示。（如果占位图比较大，自定义cell）

 *

 *  问题3:如果图片下载速度不一致，同时用户浏览快速滚动的时候，会因为cell的重用导致图片混乱。

 *  解决办法：MVC使用模型保持下载图像。再次刷新表格

 *

 *  问题4:在用户快速滚动的时候会重复添加下载操作到队列里。

 *  解决办法：建立一个下载操作的缓冲池，首先检查缓冲池里是否有当前这个下载操作，有的话就不用创建，没有的时候在下载。保证一个图片只对应一个下载操作。

 *

 *  问题5:将图像保存到模型里有缺点：

 *  优点：不用重复下载，利用mvc刷新表格，不会造成数据混乱。加载速度比较快

 *  缺点：内存消耗比较大，因为所有下载好的图像都会记录在模型里。如果数据比较多（20000），就会造成很大的内存警告

 *

 *  问题6:图像跟模型耦合性太强，导致清理内存非常困难

 *  解决办法：模型根图像分开，在控制器里边做缓存。

 *

 *  问题7:下载操作缓冲池，会越来越大，想办法清理

 *  解决办法：

 */

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

    // 创建cell的标识

    static NSString *ID = @"AppCell";

    // 查找缓存池中有没有标识为ID的cell 如果有直接拿来用 如果没有创建一个

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

    if (cell == nil) {

        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:ID];

    }

    // 给cell 设置数据

    ZPApp *app = self.appList[indexPath.row];

    cell.textLabel.text = app.name;

    cell.detailTextLabel.text = app.download;

    // 判断模型里边是否有图像

    if ([self.imageCache objectForKey:app.icon])  { // --如果模型里面有图像，直接给cell的imageview赋值。

        NSLog(@"none");

//        cell.imageView.image = app.image;

        cell.imageView.image = self.imageCache[app.icon];

    }else{

    // 下载图片

//    [NSThread sleepForTimeInterval:0.5];

//    NSLog(@"正在下载.....");

        // 现实占位图

        cell.imageView.image = [UIImage imageNamed:@"user_default"];

#warning 从这里开始剪的代码

        // 下载图片

        [self downloadImage:indexPath];

        }

    // 异步执行下载，不需要等待，会直接执行return cell 也就是先初始化一个没有图片的cell 在表格上现实，后来把图片下载完成以后，给cell的imageview属性重新赋值。

    return cell;

}

/**

 *  下载图片

 *

 *  @param indexPath <#indexPath description#>

 */

- (void)downloadImage:(NSIndexPath *)indexPath

{

    ZPApp *app = self.appList[indexPath.row];

    // 如果下载缓冲池里面有当前图片的下载操作，就不用创建下载操作，没有的话才需要 创建下载操作

#warning 缓冲池中的字典创建    key:是图片的url地址，因为这个地址是唯一的，而且是明确的。value：下载操作

    if (self.operationCache[app.icon]) {

        NSLog(@"已加入缓冲池，正在玩命下载中。。。");

        return;

    }

        // 缓冲池没有下载操作。

        // 异步下载图片

    NSBlockOperation *downloadOp = [NSBlockOperation blockOperationWithBlock:^{

        // 1.下载图片（二进制）

        NSURL *url = [NSURL URLWithString:app.icon];

        NSData *data = [NSData dataWithContentsOfURL:url];

        UIImage *img = [UIImage imageWithData:data];

//            app.image = img; // 把下载好的图片保存到模型。

//            字典的赋值不能为nil，

//        将下载好的数据保存到集合里

        if (img) {

            [self.imageCache setObject:img forKey:app.icon];

        }

        // 将操作从操作缓冲池删除

        [self.operationCache removeObjectForKey:app.icon];

        // 更新ui

        [[NSOperationQueue mainQueue]addOperationWithBlock:^{

        //            cell.imageView.image = app.image;

        // 刷新当前行  reload会重新调用cell的初始化方法。重新判断模型里面是否有图像，有的话直接显示

        [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];

            }];

        }];

        [self.opQueue addOperation:downloadOp];

        // 将当前图片的下载操作，存放到缓冲池中。

        [self.operationCache setObject:downloadOp forKey:app.icon];

}

/**

 *  真正开发中一定要注意这个方法

 */

-(void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    //当给了内存警告之后，一定要在这里做些内存清理的操作，如果不处理程序直接会被系统强制退出。

    // 清理图片内存

    [self.imageCache removeAllObjects];

    // 清理操作缓冲

    [self.operationCache removeAllObjects];

    // 取消下载队列里的人物

    [self.opQueue cancelAllOperations];

}

@end

model  .h

//

//  ZPApp.h

//  06-表格图片下载

//

//  Created by jerry on 15/9/7.

//  Copyright (c) 2015年 jerry. All rights reserved.

//

// xcode 6  pch

#import <Foundation/Foundation.h>

#import <UIKit/UIKit.h>

@interface ZPApp : NSObject

@property(nonatomic,copy)NSString *name;

@property(nonatomic,copy)NSString *icon;

@property(nonatomic,copy)NSString *download;

//@property(nonatomic,strong) UIImage  *image;

+(instancetype)appWithDict:(NSDictionary *)dict;

@end

.m

//

//  ZPApp.m

//  06-表格图片下载

//

//  Created by jerry on 15/9/7.

//  Copyright (c) 2015年 jerry. All rights reserved.

//

#import "ZPApp.h"

@implementation ZPApp

+(instancetype)appWithDict:(NSDictionary *)dict

{

    ZPApp *app =  [[self alloc]init];

    [app setValuesForKeysWithDictionary:dict];

    return app;

}

@end

plist文件

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">

<plist version="1.0">

<array>

    <dict>

        <key>name</key>

        <string>植物大战僵尸</string>

        <key>icon</key>

        <string>http://p16.qhimg.com/dr/48_48_/t0125e8d438ae9d2fbb.png</string>

        <key>download</key>

        <string>10311万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>捕鱼达人2</string>

        <key>icon</key>

        <string>http://p19.qhimg.com/dr/48_48_/t0101e2931181bb540d.png</string>

        <key>download</key>

        <string>9982万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>保卫萝卜</string>

        <key>icon</key>

        <string>http://p17.qhimg.com/dr/48_48_/t012d281e8ec8e27c06.png</string>

        <key>download</key>

        <string>8582万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>找你妹</string>

        <key>icon</key>

        <string>http://p18.qhimg.com/dr/48_48_/t0184f949337481f071.png</string>

        <key>download</key>

        <string>5910万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>水果忍者</string>

        <key>icon</key>

        <string>http://p17.qhimg.com/dr/48_48_/t015f10076f95e27e74.png</string>

        <key>download</key>

        <string>5082万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>鳄鱼小顽皮</string>

        <key>icon</key>

        <string>http://p16.qhimg.com/dr/48_48_/t01885f5596e1d30172.png</string>

        <key>download</key>

        <string>3918万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>神偷奶爸</string>

        <key>icon</key>

        <string>http://p19.qhimg.com/dr/48_48_/t0164ad383c622aabef.png</string>

        <key>download</key>

        <string>3681万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>时空猎人</string>

        <key>icon</key>

        <string>http://p17.qhimg.com/dr/48_48_/t017bc3cfcf3981b197.png</string>

        <key>download</key>

        <string>3645万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>愤怒的小鸟</string>

        <key>icon</key>

        <string>http://p18.qhimg.com/dr/48_48_/t012fea7312194537c2.png</string>

        <key>download</key>

        <string>3552万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>滑雪大冒险</string>

        <key>icon</key>

        <string>http://p18.qhimg.com/dr/48_48_/t01e61cbba53fb9eb82.png</string>

        <key>download</key>

        <string>3487万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>爸爸去哪儿</string>

        <key>icon</key>

        <string>http://p18.qhimg.com/dr/48_48_/t0108c33d3321352682.png</string>

        <key>download</key>

        <string>3117万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>我叫MT </string>

        <key>icon</key>

        <string>http://p17.qhimg.com/dr/48_48_/t01077fd80ffb5c8740.png</string>

        <key>download</key>

        <string>2386万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>3D终极狂飙</string>

        <key>icon</key>

        <string>http://p17.qhimg.com/dr/48_48_/t01f55acd4a3ed024eb.png</string>

        <key>download</key>

        <string>2166万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>杀手2</string>

        <key>icon</key>

        <string>http://p16.qhimg.com/dr/48_48_/t018f89d6e0922f75a1.png</string>

        <key>download</key>

        <string>1951万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>俄罗斯方块</string>

        <key>icon</key>

        <string>http://p0.qhimg.com/dr/48_48_/t0183a670f1dbff380f.png</string>

        <key>download</key>

        <string>1290万</string>

    </dict>

    <dict>

        <key>name</key>

        <string>刀塔传奇</string>

        <key>icon</key>

        <string>http://p16.qhimg.com/dr/48_48_/t01c3f62a27c3de7af5.png</string>

        <key>download</key>

        <string>1249万</string>

    </dict>

</array>

</plist>

相关文章