图片iOS DeveloperiOS 大神之路

封装一个网络图片加载与缓存 Category

2017-02-18  本文已影响54人  i_have_an_Apple

又有好多天没写博客了,Markdown语法都快忘了....

步入正题,赶紧来看看我们今天要搞的事情
偷偷告诉你,我们要搞事情啦.jpg

旁友,听说过 SDWebImage 伐?今天我们要搞得事情就是做一个类似的 UIImageView Category,网络图片的加载与缓存(什么?取代 SD ?旁友你想多了)

首先说一下思路

如果页面中有多个 ImageView 我们每次加载这个页面都要重新去网络请求图片的话速度是比较慢的,而且也是特别消耗性能的,所以我们这个 Category 不光是从网络加载图片,我们的另一个目的是将第一次从网络加载的图片缓存到内存与硬盘(就是存到手机的闪存,也就是本地化保存,为了方便以下统称存到硬盘),下次取用的时候先从内存中查找,如果没有再查找硬盘,还是没有再从网络加载。

开始第一步,首先创建之后所需要的缓存内存与硬盘的工具类

内存存储工具类

内存存储,实际上就是把下载好的图片存到可变字典,我这边使用了一个单例来保存这个字典

@interface WebImageMemory : NSObject

//使用字典存储
@property(nonatomic,strong)NSMutableDictionary *imageDic;

//单例方法
+ (WebImageMemory *)shareInstancy;

//内存存储的方法
- (void)setImageToMemoryWithImage:(UIImage *)image withName:(NSString *)imageName;

//内存读取的方法
- (UIImage *)getImageFormMenoryWithName:(NSString *)imageName;



@end

下面是实现代码

static WebImageMemory *webImgMemory;
//单例方法
+ (WebImageMemory *)shareInstancy{
    
    //GCD只执行一次的方法
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        
        webImgMemory = [[WebImageMemory alloc] init];
        
    });
    
    return webImgMemory;
}

//懒加载
- (NSMutableDictionary *)imageDic{
    
    if (!_imageDic) {
        
        _imageDic = [[NSMutableDictionary alloc] init];
        
    }
    return _imageDic;
}

//存储的方法
- (void)setImageToMemoryWithImage:(UIImage *)image withName:(NSString *)imageName{
    
    [self.imageDic setObject:image forKey:imageName];
    
}

//读取的方法
- (UIImage *)getImageFormMenoryWithName:(NSString *)imageName{
    
    UIImage *image = [self.imageDic objectForKey:imageName];
    
    if (image) {
        return image;
    }
    
    return nil;
    
}

这个内存存储相当简单,我们再看看硬盘存储

硬盘存储工具类

同样的,我也是用一个单例来管理存储的一些相关操作,并保存本地存储的文件路径

@interface WebImageCaches : NSObject

@property(nonatomic,strong)NSString *imagePath;

//单例
+ (WebImageCaches *)shareInstance;

//硬盘存储的方法
- (void)setImageToCachesWithImageData:(NSData *)imageData withImageName:(NSString *)imageName;

//硬盘缓存的方法
- (UIImage *)getImageFromCachesWithName:(NSString *)imageName;

@end

实现部分,这边用保存好的本地路径拼接上文件名,作为保存图片文件的最终路径

static WebImageCaches *imageCaches;
//单例方法
+ (WebImageCaches *)shareInstance{
    
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        
        imageCaches = [[WebImageCaches alloc] init];
        
    });
    
    return imageCaches;
    
}

//复写imagePath的get方法,在第一次get时给imagePath赋值
- (NSString *)imagePath{
    
    if (!_imagePath) {
        //获取文件存储路径
        _imagePath = [NSHomeDirectory() stringByAppendingString:@"/Library/Caches/WebImageCaches/"];
        //通过文件管家创建该路径
        [[NSFileManager defaultManager] createDirectoryAtPath:_imagePath withIntermediateDirectories:YES attributes:nil error:nil];
    }
    
    return _imagePath;
    
}

//存入硬盘
- (void)setImageToCachesWithImageData:(NSData *)imageData withImageName:(NSString *)imageName{
    
    //拼接文件路径
    NSString *filePath = [self.imagePath stringByAppendingString:imageName];
    //使用文件管家将data存储
    [[NSFileManager defaultManager] createFileAtPath:filePath contents:imageData attributes:nil];
    
}

//从硬盘读取
- (UIImage *)getImageFromCachesWithName:(NSString *)imageName{
    
    //拼接文件路径
    NSString *filePath = [self.imagePath stringByAppendingString:imageName];
    //取出图片
    UIImage *image = [UIImage imageWithContentsOfFile:filePath];
    
    return image;
    
}

第二步,创建 UIImageView 的 Category

使用 MD5 加密图片链接作为图片名

这边记得要导入#import <CommonCrypto/CommonCrypto.h>

//MD5加密
- (NSString *)md5:(NSString *)str{
    
    const char *cStr = [str UTF8String];
    unsigned char schemes[CC_MD5_DIGEST_LENGTH];
    
    //MD5加密函数
    CC_MD5(cStr, (UInt32)strlen(cStr), schemes);
    
    NSMutableString *md5Str = [[NSMutableString alloc] init];
    
    for (int i = 0; i < CC_MD5_DIGEST_LENGTH; i ++) {
        
        [md5Str appendFormat:@"%02x",schemes[i]];
        
    }
    [md5Str appendFormat:@".png"];
    
    
    return md5Str;
}
暴露一个获取图片的方法

- (void)setimageWithURL:(NSString *)urlString;
来看看它的实现

- (void)setimageWithURL:(NSString *)urlString{
    
    //MD5加密
    NSString *imageName = [self md5:urlString];
    
    //首先从内存中读取
    UIImage *image = [[WebImageMemory shareInstancy] getImageFormMenoryWithName:imageName];
    
    //如果能从内存取到值,就直接加载
    if (image) {
        self.image = image;
        NSLog(@"从内存加载");
        return;
    }
    
    //其次从硬盘中读取
    UIImage *image2 = [[WebImageCaches shareInstance] getImageFromCachesWithName:imageName];
    
    //如果能从硬盘中取到,就直接加载
    if (image2) {
        self.image = image2;
        NSLog(@"从硬盘加载");
        //存入内存
        [[WebImageMemory shareInstancy] setImageToMemoryWithImage:image2 withName:imageName];
        return;
    }
    
    //创建一个串行队列,执行下载任务
    dispatch_queue_t download_queu = dispatch_queue_create("download_queue", DISPATCH_QUEUE_SERIAL);
    
    //异步添加任务  开辟子线程
    dispatch_async(download_queu, ^{
       
        //下载任务
        NSURL *imageURL = [NSURL URLWithString:urlString];
        NSData *imageData = [NSData dataWithContentsOfURL:imageURL];
        UIImage *image = [UIImage imageWithData:imageData];
        
        NSLog(@"下载");
        
        if (image == nil) {
            NSLog(@"图片下载失败");
            return;
        }
        
        //获取主队列向主队列异步添加加载图片的任务
        dispatch_async(dispatch_get_main_queue(), ^{
           
            self.image = image;
            //将网路下载的图片存入内存
            [[WebImageMemory shareInstancy] setImageToMemoryWithImage:image withName:imageName];
            
            //存入硬盘
            [[WebImageCaches shareInstance] setImageToCachesWithImageData:imageData withImageName:imageName];
            
        });
        
    });
    
    
}

首先将图片链接经过 MD5 加密后作为文件名去查找内存字典中有没有保存有的话直接取出来,显示到 UI,没有的话查找硬盘中与没有保存图片文件,有的话取出来更新到 UI,如果还是没有,我们创建一条串行队列,这样保证图片是一个个加载的,向这个串行队列异步添加下载任务,下载完成后保存到内存与硬盘

到此为止,一个简单的网络图片加载就封装完成了,不过还是有很多的缺陷,比如缓存到内存的图片过多、在 TableView 中使用会不会造成卡顿等等,这篇文章只是介绍了一个简单的网络图片缓存思路,直接用在项目中的话还需要大量的完善

这个 demo 虽然很简单,上面写的也很清楚,但是按照惯例,我还是把GitHub 地址附上
demo点这里点这里点这里

上一篇下一篇

猜你喜欢

热点阅读