使用UIImageView展现来自网络的图片

原创 2012年03月14日 13:06:01

在iOS开发过程中,经常会遇到使用UIImageView展现来自网络的图片的情况,最简单的做法如下:

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    self.imageView = [[[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)] autorelease];
    self.imageView.layer.masksToBounds = YES;
    self.imageView.layer.cornerRadius = 5.0f;
    [self.imageView setBackgroundColor:[UIColor grayColor]];
    [self.view addSubview:self.imageView];
    
    NSURL *imageUrl = [NSURL URLWithString:IMAGE_URL];
    UIImage *image = [UIImage imageWithData:[NSData dataWithContentsOfURL:imageUrl]];
    self.imageView.image = image;
}

这么做,最直接的问题就是阻塞UI线程了。

于是考虑利用NSOperationQueue来异步加载图片:

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    operationQueue = [[NSOperationQueue alloc] init];
    
    self.imageView = [[[UIImageView alloc] initWithFrame:CGRectMake(110, 50, 100, 100)] autorelease];
    self.imageView.layer.masksToBounds = YES;
    self.imageView.layer.cornerRadius = 5.0f;
    [self.imageView setBackgroundColor:[UIColor grayColor]];
    [self.view addSubview:self.imageView];
    
    NSInvocationOperation *op = [[NSInvocationOperation alloc] initWithTarget:self selector:@selector(downloadImage) object:nil];
    [operationQueue addOperation:op];
}

- (void)downloadImage
{
    NSURL *imageUrl = [NSURL URLWithString:IMAGE_URL];
    UIImage *image = [UIImage imageWithData:[NSData dataWithContentsOfURL:imageUrl]];
    self.imageView.image = image;
}

这么做的话,就可以避免阻塞UI线程了。当图片异步加载完成后,就会展现出来。

但是,第二次进入该界面,还是要重新下载图片,用户体验不好,且浪费资源(比如耗电)。

于是,考虑缓存已经下载的图片。

模仿操作系统(Cache - Memory - Disk),缓存图片也可以采取两层模型:内存和磁盘。

保存到内存中比较简单,只需要用NSDictionary来维护即可。而保存到磁盘,涉及到本地文件读写,可以参考“文件和数据管理”。

首先需要创建一个缓存目录:

NSArray *paths = NSSearchPathForDirectoriesInDomains(NSCachesDirectory, NSUserDomainMask, YES);
        diskCachePath = [[[paths objectAtIndex:0] stringByAppendingPathComponent:@"ImageCache"] retain];
        
        if (![[NSFileManager defaultManager] fileExistsAtPath:diskCachePath]) {
            NSError *error = nil;
            [[NSFileManager defaultManager] createDirectoryAtPath:diskCachePath
                                      withIntermediateDirectories:YES
                                                       attributes:nil
                                                            error:&error];
        }

接着可以用图片名称或者URL或者hash过后的值作为key(本地文件名),写入到本地:

if (![[NSFileManager defaultManager] fileExistsAtPath:localPath]) {
        [[NSFileManager defaultManager] createFileAtPath:localPath contents:localData attributes:nil];
    }

这样,在每次下载图片之前,先判断是否已经有缓存了,可以优化体验和性能。

我把完整的源代码写成Category以重用,放在GitHub上:https://github.com/siqin/OnlineImageView


Jason Lee @ Hangzhou

Blog: http://blog.csdn.net/jasonblog

Weibo: @思禽饮霜

iOS开发————几种图片加载方式

作为编者自己的一个复习总结以及广大iOS开发初学者的小小福利,呕心沥血诞生出这篇图片加载方式的文章,如有不足请指正。 先谈谈iOS图像加载方式的分类吧。 本地加载:从程序包中加载,从沙盒加...

iOS-UIImageView加载网络下载的图片(异步+多线程)

最原始的加载网络下载的图片方式://最原始加载网络图片方法,相当阻塞主线程,界面卡顿 -(void)setImageWithURL:(NSString *)imageDownloadUrl{ ...

UIImageView加载图片

//初始化 UIImageView *imageView=[[UIImageView alloc]initWithFrame:CGRectMake(100,200, 120, 120)]; ...

UIImageView异步加载网络图片

方法1:在UI线程中同步加载网络图片 UIImageView *headview = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, ...
  • mad1989
  • mad1989
  • 2013年03月14日 20:43
  • 23849

UIimage的几种加载方式

根据图片名称加载  UIImage* image = [UIImage imageNamed:@"banner"]; 根据url 加载  NSURL...

IOS中UIImageView使用网络图片

考虑到UI线程阻塞。使用_operationQueue。 NSInvocationOperation *op = [[NSInvocationOperation alloc] initWithTar...
  • howlaa
  • howlaa
  • 2016年04月28日 17:10
  • 409

iOS UIImageView显示网络图片的基础用法

先解释下以下代码中的变量: picsURL是一个存储URL地址的数组 choice是选择图片的索引数 self.imageView是View中的UIImageView 其实显示一幅网络上的图片十分简单...

UIImageView图片显示方式

我们都知道在ios中,每一个UIImageView都有他的frame大小,但是如果图片的大小和这个frame的大小不符合的时候会怎么样呢?在默认情况,图片会被压缩或者拉伸以填满整个区域。 通过查...
  • cukiy
  • cukiy
  • 2016年09月23日 10:00
  • 2213

IOS-UIImageView

//    (1)创建     UIImageView *imageView = [[UIImageView alloc ] init];          UIIma...

ios之UIImageView和UIImage

UIImageView中的视图内容显示模式     UIImageView *imageV=[[UIImageView alloc]init];     imageV.scaleToFill--...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用UIImageView展现来自网络的图片
举报原因:
原因补充:

(最多只允许输入30个字)