ios--多图下载，优化cell

1.需求：在tableview的每一个cell里显示从网络下载的图片

2.demo：

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

    static NSString *ID = @"app";
    //1.创建cell
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
    //2.设置cell数据
    //2.1拿到该行cell对应的数据
    JKYApp *appM = self.apps[indexPath.row];
    cell.textLabel.text = appM.name;
    cell.detailTextLabel.text = appM.download;
    //设置图标

    UIImage *image = [self.imageDic objectForKey:appM.icon];
    if (image) {
        cell.imageView.image = image;
    }else{
        NSURL *url = [NSURL URLWithString:appM.icon];
        NSData *imageData = [NSData dataWithContentsOfURL:url];
        UIImage *image = [UIImage imageWithData:imageData];
        cell.imageView.image = image;

        //将图片保存到内存缓存
        [self.imageDic setObject:image forKey:appM.icon];
    }
    //3.返回cell
    return cell;
}

3.问题：

UI不流畅

dataWithContentsOfURL：是耗时操作，将其放在主线程会造成卡顿。如果图片很多，图片很大，而且网络情况不好的话会造成用户体验极差。

图片重复下载

由于没有缓存机制，即使下载完成并显示了当前cell的图片，但是当该cell再一次滚动，显示的时候还是会下载它所对应的图片，耗费了下载流量，而且还导致重复操作。

4.解决方案

1、图片的URL：因为每张图片对应的URL都是唯一的，所以我们可以通过它来建立图片缓存和下载操作的缓存的键，以及拼接沙盒缓存的路径字符串。

2、图片缓存（字典）：存放于内存中；键为图片的URL，值为UIImage对象。作用：读取速度快，直接使用UIImage对象。

3、下载操作缓存（字典）：存放与内存中，键为图片的URL，值为NSBlockOperation对象。作用：用来避免对于同一张图片还要开启多个下载线程。

4、沙盒缓存(文件路径对应NSData)：存放于磁盘中，位于Cache文件夹内，路径为“Cache/图片URL的最后的部分”，值为NSData对象（将UIImage转化为NSData才能写入磁盘里）。作用：程序断网，再次启动也可以直接在磁盘中拿到图片。

代码：

/先去查看内存缓存中该图片时候已经存在,如果存在那么久直接拿来用,否则去检查磁盘缓存
    //如果有磁盘缓存,那么保存一份到内存,设置图片,否则就直接下载
    //1)没有下载过
    //2)重新打开程序

    UIImage *image = [self.images objectForKey:appM.icon];
    if (image) {
        cell.imageView.image = image;
        NSLog(@"%zd处的图片使用了内存缓存中的图片",indexPath.row) ;
    }else
    {
        //保存图片到沙盒缓存
        NSString *caches = [NSSearchPathForDirectoriesInDomains(NSCachesDirectory, NSUserDomainMask, YES) lastObject];
        //获得图片的名称,不能包含/
        NSString *fileName = [appM.icon lastPathComponent];
        //拼接图片的全路径
        NSString *fullPath = [caches stringByAppendingPathComponent:fileName];


        //检查磁盘缓存
        NSData *imageData = [NSData dataWithContentsOfFile:fullPath];
        //废除
        imageData = nil;

        if (imageData) {
            UIImage *image = [UIImage imageWithData:imageData];
            cell.imageView.image = image;

            NSLog(@"%zd处的图片使用了磁盘缓存中的图片",indexPath.row) ;
            //把图片保存到内存缓存
            [self.images setObject:image forKey:appM.icon];

//            NSLog(@"%@",fullPath);
        }else
        {
            //检查该图片时候正在下载,如果是那么久什么都捕捉,否则再添加下载任务
            NSBlockOperation *download = [self.operations objectForKey:appM.icon];
            if (download) {

            }else
            {

                //先清空cell原来的图片
                cell.imageView.image = [UIImage imageNamed:@"Snip20160221_306"];

                download = [NSBlockOperation blockOperationWithBlock:^{
                    NSURL *url = [NSURL URLWithString:appM.icon];
                    NSData *imageData = [NSData dataWithContentsOfURL:url];
                    UIImage *image = [UIImage imageWithData:imageData];

                     NSLog(@"%zd--下载---",indexPath.row);

                    //容错处理
                    if (image == nil) {
                        [self.operations removeObjectForKey:appM.icon];
                        return ;
                    }
                    //演示网速慢的情况
                    //[NSThread sleepForTimeInterval:3.0];

                    //把图片保存到内存缓存
                    [self.images setObject:image forKey:appM.icon];

                    //NSLog(@"Download---%@",[NSThread currentThread]);
                    //线程间通信
                    [[NSOperationQueue mainQueue] addOperationWithBlock:^{

                        //cell.imageView.image = image;
                        //刷新一行
                        [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationLeft];
                        //NSLog(@"UI---%@",[NSThread currentThread]);
                    }];


                    //写数据到沙盒
                    [imageData writeToFile:fullPath atomically:YES];

                    //移除图片的下载操作
                    [self.operations removeObjectForKey:appM.icon];

                }];

                //添加操作到操作缓存中
                [self.operations setObject:download forKey:appM.icon];

                //添加操作到队列中
                [self.queue addOperation:download];
            }    
        }
    }

    //3.返回cell
    return cell;

5.内存警告处理

-(void)didReceiveMemoryWarning
{
    [self.images removeAllObjects];

    //取消队列中所有的操作
    [self.queue cancelAllOperations];
}

原文链接：https://www.jianshu.com/p/612d5fdccb7f

ios--多图下载，优化cell

猜你喜欢