美文网首页
iOS的GIF动画效果实现

iOS的GIF动画效果实现

作者: 鬼泣天下第一 | 来源:发表于2017-11-22 15:42 被阅读0次

    GIF在iOS中的使用场景

    GIF在iOS中的使用场景有以下三个方面。

    (1)GIF图片分解为单帧图片。

    (2)一系列单帧图片合成GIF图片。

    (3)iOS系统上展示GIF动画效果。

    我有几张阿里云幸运券分享给你,用券购买或者升级阿里云相应产品会有特惠惊喜哦!把想要买的产品的幸运券都领走吧!快下手,马上就要抢光了。

    在GIF的合成和分解方面将会接触到iOS图像处理核心框架ImageIO,作为iOS系统中图像处理的核心框架,它为我们提供了各种丰富的API,本文将要实现的GIF分解与合成功能,通过ImageIO就可以很方便地实现。GIF动画展示效果将结合UIImageView和定时器,利用逐帧展示的方式为大家呈现GIF动画效果。

    GIF分解单帧图片

    1 GIF图片分解过程

    GIF分解为单帧图片的过程如下。

    整个过程划分为5个模块、4个过程,分别如下。

    (1)本地读取GIF图片,将其转换为NSdata数据类型。

    (2)将NSData作为ImageIO模块的输入。

    (3)获取ImageIO的输出数据:UIImage。

    (4)将获取到的UIImage数据存储为JPG或者PNG格式保存到本地。

    在整个GIF图片分解的过程中,ImageIO是处理过程的核心部分。它负责对GIF文件格式进行解析,并将解析之后的数据转换为一帧帧图片输出。幸运的是我们并不是“轮子”的创造者,而是只要使用轮子即可。所以在本书中我们不去研究GIF分解合成算法的具体实现方式,而是将注意力聚焦在如何使用ImageIO框架实现需要的功能上。

    2 GIF图片分解代码实现

    在正式分析代码之前,先来看看整个工程的文件结构,如图。

    源文件使用的是plane.gif文件。ViewController.swift文件中的viewDidLoad()方法中包含了GIF图片分解为单帧图片并保存到本地的所有代码。下面就结合“GIF分解为单帧图片的过程”来实现这一功能。

    功能模块一:读取GIF文件并将之转换为NSdata类型。

    1letgifPath:NSString = Bundle.main.path(forResource:"plane", ofType:"gif")! as NSString2letgifData:Data= try!Data(contentsOf: URL(fileURLWithPath: gifPath as String))

    代码第1行通过path方法获取文件名为plane、文件格式为gif的文件地址。第2行获取文件信息并加载到gifData(NSData类型)变量中。至此已经完成整个处理流程的第一个环节。

    功能模块二:利用ImageIO框架,遍历所有GIF子帧。需要注意的是使用ImageIO必须把读取到的NSdata数据转换为ImageIO可以处理的数据类型,这里使用CGImageSourceRef实现。其相应功能模块的处理流程如下所示。

    1let gifDataSource:CGImageSource=CGImageSourceCreateWithData(gifData asCFData,nil)!2let gifImageCount:Int =CGImageSourceGetCount(gifDataSource)3foriin0...gifImageCount-1{            let imageref:CGImage? =CGImageSourceCreateImageAtIndex(gifDataSource, i,nil)            let image:UIImage=UIImage(cgImage: imageref!,scale:UIScreen.main.scale,orientation:UIImageOrientation.up )        }

    下面是GIF数据处理流程中ImageIO部分功能描述。代码第1行实现将GIF原始数据类型NSdata转换为ImageIO可以直接处理的数据类型CGImageSourceRef。第2行获取当前GIF图片的分帧个数。我们知道GIF图片都是由一帧帧图片组成的,那么这一行就是为了获取构成GIF图片的张数。第3行对CGImageSource数据按照图片的序号进行遍历,将遍历出的结果使用UIImage系统方法将之转换为UIImage。

    这里重点为大家介绍两种方法。

    点击链接阅读全文:yq.aliyun.com/articles/69298

    相关文章

      网友评论

          本文标题:iOS的GIF动画效果实现

          本文链接:https://www.haomeiwen.com/subject/yixovxtx.html