iOS 关于 GIF 图片那点事

前言

前几天我们项目组的群里提了这么一件事情:在我们的应用中存储动态的GIF图到相册,保存的图片变成了静态图片。而微博则能正确保存,可见这并不是一个技术不可实现的。前不久刚好看了苹果关于ImageIO框架的指南,借着这个契机,我就去调研调研其中的原委。

使用UIImage读取GIF图片的不足

UIImage类在UIKit框架中,是我们最常使用的存储图片类。该类提供了可以使用图片路径或是图片数据来实例化的类方法。UIImage类底层采用ImageIO框架来读取图片数据,下图分别为+imageWithContentsOfFile:和+imageWithData:调用的堆栈。

image堆栈.png

从堆栈中我们可以看到图片读取的大致流程如下:

  1. 根据文件路径或是数据生成CGImageSource;
  2. 然后调用CGImageSourceCreateImageAtIndex方法获取一帧的图片,类型为CGImage;
  3. 让UIImage对象持有该CGImage。

在流程的第一步生成的CGImageSource,仍然保留着GIF的全部信息。而在流程的第二步中出了问题。动态的Gif图与静态格式图片不同,它包含有多张的静态图片。CGImageSourceCreateImageAtIndex只能返回索引值的图片,丢失了其他的图片信息。因此,我们只获取到了其中的一帧图片。出于好奇,我选择了一张只有四帧完全不同的Gif图,通过测试观察,UIImage获取的是第一帧的图片。既然我们不能用UIImage或CGImage来处理Gif图,我们是否可以降级,采用ImageIO框架来处理呢。答案是肯定的。

使用 ImageIO 框架解析GIF图片

我参考了YYImage框架的设计,定义了两个类,分别为JWGifDecoder和JWGifFrame,JWGifDecoder类负责GIF图片数据的解析,而JWGifFrame表示帧。两者的头文件如下:

#import

#import "JWGifFrame.h"

@interface JWGifDecoder : NSObject

@property (nonatomic,readonly) NSData *data;    /**

#import

#import

@interface JWGifFrame : NSObject

@property (nonatomic,assign) NSUInteger index;  /**

JWGifDecoder内部使用CGImageSource来解析图片数据。实例化时候,该类使用CGImageSourceCreateWithData ()方法(这里的c语言方法忽略参数)一个CGImageSource,然后采用CGImageSourceGetCount ()获得其内部的图片个数也就是帧数。而在生成帧对象时候,采用CGImageSourceCopyPropertiesAtIndex ()方法获得对应帧的属性,采用CGImageSourceCreateImageAtIndex()方法得到图片。

#import "JWGifDecoder.h"

#import

@interface JWGifDecoder ()

{

CGImageSourceRef _source;

}

@end

@implementation JWGifDecoder

+(instancetype)decoderWithData:(NSData *)data

{

if ( !data ) return nil;

JWGifDecoder *decoder = [[JWGifDecoder alloc] init];

[decoder _decoderPrepareWithData:data];

return decoder;

}

- (void)dealloc

{

CFRelease(_source);

}

-(void)_decoderPrepareWithData:(NSData *)data

{

_data = data;

_source = CGImageSourceCreateWithData((__bridge CFDataRef)data, NULL);

_frameCount = CGImageSourceGetCount(_source);

CFDictionaryRef properties = CGImageSourceCopyProperties(_source, NULL);

CFDictionaryRef gifProperties = CFDictionaryGetValue(properties, kCGImagePropertyGIFDictionary);

CFTypeRef loop = CFDictionaryGetValue(gifProperties, kCGImagePropertyGIFLoopCount);

if (loop) CFNumberGetValue(loop, kCFNumberNSIntegerType, &_loopCount);

CFRelease(properties);

}

-(JWGifFrame *)frameAtIndex:(NSUInteger)index

{

if ( index >= _frameCount ) return nil;

JWGifFrame *frame = [[JWGifFrame alloc] init];

frame.index = index;

NSTimeInterval duration = 0;

CFDictionaryRef frameProperties = CGImageSourceCopyPropertiesAtIndex(_source, index, NULL);

CFDictionaryRef gifFrameProperties = CFDictionaryGetValue(frameProperties, kCGImagePropertyGIFDictionary);

CFTypeRef delayTime = CFDictionaryGetValue(gifFrameProperties, kCGImagePropertyGIFUnclampedDelayTime);

if(delayTime) CFNumberGetValue(delayTime, kCFNumberDoubleType, &duration);

CFRelease(frameProperties);

frame.duration = duration;

CGImageRef cgImage = CGImageSourceCreateImageAtIndex(_source, index, NULL);

UIImage *image = [UIImage imageWithCGImage:cgImage];

frame.image = image;

CFRelease(cgImage);

return frame;

}

保存GIF格式图片至相册

UIImage只会保留一帧的信息,而图片的数据则具有GIF的所有数据。因此,相册读取GIF格式图片有个原则:在保存图片至相册时,必须保存图片的数据而不是UIImage对象。

IOS8以下ALAssetsLibrary框架处理相册,在IOS8以上,则是采用Photos框架。在这篇博客(http://www.jianshu.com/p/ad391f4d0bcb)中说在IOS8中使用Photos的方法会保存不了,由于没有IOS8的系统的手机,我也无法做相关测试。目前测试我手上的IOS10系统的iphone6s,可以成功保存,保存的GIF图片可以在微信中成功发送。保存相册的代码如下所示:

NSString *path = [[NSBundle mainBundle] pathForResource:@"niconiconi" ofType:@"gif"];

NSData *data = [NSData dataWithContentsOfFile:path];

if ([UIDevice currentDevice].systemVersion.floatValue >= 9.0f) {

[[PHPhotoLibrary sharedPhotoLibrary] performChanges:^{

PHAssetResourceCreationOptions *options = [[PHAssetResourceCreationOptions alloc] init];

[[PHAssetCreationRequest creationRequestForAsset] addResourceWithType:PHAssetResourceTypePhoto data:data options:options];

} completionHandler:^(BOOL success, NSError * _Nullable error) {

NSLog(@"是否保存成功:%d",success);

}];

}

else {

ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init];

[library writeImageDataToSavedPhotosAlbum:data metadata:nil completionBlock:^(NSURL *assetURL, NSError *error) {

}];

}

结语

ImageIO框架给了我们更加强大的图片处理能力,它可以处理UIImage无法应付的Gif格式的图片。对于那些较高级的API无法处理的事情,可以试一试用更低层的框架看看是否进行处理。发现很多内容在苹果的 Guide里都有说明,以后需要多多看看。

这篇文章中还有很多东西没有讲到,比如相册读取Gif图片,又比如代码将图片保存成Gif图片(这点在苹果的Guide里有提到)等,以后再补充吧。

参考

  • Image I/O Programming Guide

    http://t.cn/RfPbLdM

  • iOS开发-gif图片上传

    http://t.cn/Rt39huW

  • GitHub: YYWebImage

    http://t.cn/RUSClXb

  • iOS中的imageIO与image解码

    http://t.cn/RtwyP52

时间: 2024-10-12 15:05:48

iOS 关于 GIF 图片那点事的相关文章

iOS 加载图片选择imageNamed 方法还是 imageWithContentsOfFile?

Apple官方的文档为生成一个UIImage对象提供了两种方法: 1. imageNamed,其参数为图片的名字: 2. imageWithContentsOfFile,其参数也是图片文件的路径. 那么两种有什么区别吗? 肯定是有的.根据Apple的官方文档: imageNamed: 这个方法用一个指定的名字在系统缓存中查找并返回一个图片对象如果它存在的话.如果缓存中没有找到相应的图片,这个方法从指定的文档中加载然后缓存并返回这个对象.因此imageNamed的优点是当加载时会缓存图片.所以当图

iOS开发基础-图片切换(2)

延续:iOS开发基础-图片切换(1),对(1)里面的代码进行改善. 在 ViewController 类中添加新的数组属性:  @property (nonatomic, strong) NSArray *infoArray; //存放图片信息 通过 self.infoArray 的 getter 方法对其实现初始化(懒加载),其中代码中的 _infoArray 不能用 self.infoArray 替换: 1 //infoArray的get方法 2 - (NSArray *)infoArray

ios学习笔记图片+图片解释(c语言 oc语言 ios控件 ios小项目 ios小功能 swift都有而且笔记完整喔)

下面是目录其中ios文件夹包括了大部分ios控件的介绍和演示,swift的时完整版,可以学习完swift(这个看的是swift刚出来一周的视频截图,可能有点赶,但是完整),c语言和oc语言的也可以完整的学习完所需知识,,其他文件夹的内容如其名说描述一样 没张图片都有文字说明,可以需要该功能的时候搜索一下然后打开图片就可以学习到 网盘下载地址:需要的话给留言我再传上去 http://www.cnblogs.com/langtianya原创 ios学习笔记图片+图片解释(c语言 oc语言 ios控件

iOS开发基础-图片切换(3)

延续:iOS开发基础-图片切换(2),对(2)里面的代码用属性列表plist进行改善. 新建 Property List 命名为 Data 获得一个后缀为 .plist 的文件. 按如图修改刚创建的文件: 最后,修改 infoArray 的 getter 方法: 1 //infoArray的getter方法 2 - (NSArray *)infoArray { 3 NSLog(@"需要获取图片信息数组"); 4 //只实例化一次 5 if (_infoArray == nil) { 6

IOS APP圆形图片的实现

1 //设置圆形cornerRadius,是宽或高的一半 2 3 _imageView.layer.masksToBounds = YES; 4 5 6 7 CGFloat w = _imageView.frame.size.width / 2; 8 9 _imageView.layer.cornerRadius = w; 10 11 12 13 //设置边框宽度及颜色 14 15 [_imageView.layersetBorderWidth:2]; 16 17 [_imageView.lay

ios 按钮或图片框圆角处理

导入库头文件(重点) #import <QuartzCore/QuartzCore.h> //圆角设置 imageView.layer.cornerRadius = 6; imageView.layer.masksToBounds = YES; //边框宽度及颜色设置 [imageView.layer setBorderWidth:2]; [imageView.layer setBorderColor:[UIColor blueColor]];  //设置边框为蓝色 //自动适应,保持图片宽高

iOS 字符串和图片互转

for (UIImage *myImg in _imgArray) { NSData *imageData = UIImageJPEGRepresentation(myImg,0.5); NSString *_encodedImageStr = [imageData base64Encoding]; [parameters setObject:_encodedImageStr forKey:[NSString stringWithFormat:@"img[%i]",imgCount]]

【原】iOS 设计中 图片后期简单处理的完美组合

iOS 设计中 图片后期简单处理的完美组合 四张图+.DS_Store (3张alpha通道“是”,1张没有alpha通道) 5,909,971 字节(磁盘上的 5.9 MB),共 5 项 第一步:转非alpha通道,工具 Alpha-Channel-Remover https://github.com/bpolat/Alpha-Channel-Remover  这个地址就哦了 http://alphachannelremover.blogspot.com 这个墙内墙外都试过没打开 转完后:变小

IOS 视频分解图片、图片合成视频

在IOS视频处理中,视频分解图片和图片合成视频是IOS视频处理中经常遇到的问题,这篇博客就这两个部分对IOS视频图像的相互转换做一下分析. (1)视频分解图片 这里视频分解图片使用的是AVAssetImageGenerator,利用这个class可以很方便的实现不同时间戳下,视频帧的抓取.注意一般这种视频分解图片帧的方法都是放在子线程中的,而UI更新操作都是放在主线程中的.下面来看看核心代码: _imageGenerator = [[AVAssetImageGenerator alloc] in