iOS-多图下载

栏目: IOS · 发布时间: 5年前

内容简介:需求在tableview的每一个cell里显示从网络下载的图片dataWithContentsOfURL:是耗时操作,将其放在主线程会造成卡顿。如果图片很多,图片很大,而且网络情况不好的话会造成用户体验极差

1.iOS多图下载的缓存处理

需求

在tableview的每一个cell里显示从网络下载的图片

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;
}

2.造成的问题

1.UI不流畅

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

2.图片重复下载

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

3.解决方案

注: 原图是大神J_Knight_文章里下载的,还有下面这一节内容也是来源于J_Knight_老师,觉得挺好的就拿过来知识点复习汇总了,如有冒犯必定立即删除。

iOS-多图下载

  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;

4.内存警告处理

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

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

作者:小金渣丶

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


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

PHP 5完全攻略

PHP 5完全攻略

杜江 / 2010-5 / 79.00元

《PHP 5完全攻略(畅销书升级版)》是目前第一本真正介绍PHP 5及MySQL 5新增语法与功能的中文版本权威宝典!《PHP 5完全攻略(畅销书升级版)》本着精、全、要三宗旨,从理论中延伸,从实践中深入,翔实并完善地描述了PHP 5的开发特性与MySQL 5数据库。《PHP 5完全攻略(畅销书升级版)》分为两大部分,第1部分主要阐述PHP开发的基础知识,如PHP数组与表单处理、PHP 5面向对象......一起来看看 《PHP 5完全攻略》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具

RGB HSV 转换
RGB HSV 转换

RGB HSV 互转工具