iOS:长图切割并转为动画gif——精灵表单sprite Sheet的转化

通常的,iOS显示gif可以将文件转为NSData后再对其进行解析,通过CADisplayLink逐帧进行提取、播放,判断NSData是否为gif图的方法如下:


-(void)isGifData:(NSData *)data { BOOL hasData = ([data length] > 0);
if (!hasData) {
return NO;
}
CGImageSourceRef imageSource = CGImageSourceCreateWithData((__bridge CFDataRef)data,
(__bridge CFDictionaryRef)@{(NSString *)kCGImageSourceShouldCache: @NO});
// Early return on failure!
if (!imageSource) {
return NO;
} // Early return if not GIF!
//关键未知
CFStringRef imageSourceContainerType = CGImageSourceGetType(imageSource);
BOOL isGIFData = UTTypeConformsTo(imageSourceContainerType, kUTTypeGIF);
return isGIFData;
}
///参考第三方库FLAnimatedImage中FLAniamtedImage.m
///- (instancetype)initWithAnimatedGIFData:(NSData *)data optimalFrameCacheSize:(NSUInteger)optimalFrameCacheSize predrawingEnabled:(BOOL)isPredrawingEnabled

(此方法稍微改造一下还可以同时识别PNG/JPEG)

而精灵表单的本质上是一张大的图片,是将所有帧的图像堆到同一张图片里,只需要在一定间隔内读取指定小区域的照片,利用人眼视觉残留的特性,即可呈现动画效果,本文将探讨如何将此类图转为gif。

//相关参数,根据实际情况自行赋值,省略
CGFloat frameDurations;//帧间隔,单位为秒
NSMutableArray <NSValue *>* frameRects;//每一帧在大图中的区域
NSURL *savePathURL;//保存gif图片地址
UIImage *image;//sprite sheet大图 //gif图的参数
NSDictionary *fileSetting = @{
(__bridge id)kCGImagePropertyGIFDictionary: @{
(__bridge id)kCGImagePropertyGIFLoopCount: @0, // 0 means loop forever
}
}; NSDictionary *frameSetting = @{
(__bridge id)kCGImagePropertyGIFDictionary: @{
(__bridge id)kCGImagePropertyGIFDelayTime: @(frameDurations), // a float (not double!) in seconds, rounded to centiseconds in the GIF data
}
};
CGImageDestinationRef destination = CGImageDestinationCreateWithURL((__bridge CFURLRef)savePathURL, kUTTypeGIF, frameRects.count, NULL);
CGImageDestinationSetProperties(destination, (__bridge CFDictionaryRef)fileSetting); //开始处理
for (int i = 0; i < frameRects.count; i ++) {
CGRect rect = contentRects[i].CGRectValue;
@autoreleasepool {
//及时释放循环中累计的内存
CGImageRef subImageRef = CGImageCreateWithImageInRect(image.CGImage, rect); CGImageDestinationAddImage(destination, subImageRef, (__bridge CFDictionaryRef)frameSetting);
CGImageRelease(subImageRef);
}
}
//善后
if (!CGImageDestinationFinalize(destination)) {
NSLog(@"failed to finalize image destination");
}
CFRelease(destination); //生成gif
NSData *fileData = [[NSData alloc] initWithContentsOfURL:savePathURL];
//根据情况是否删除缓存文件

此段代码参考从视频中截取缩略图生成gif图片

还可以改进的地方:文中实现了图片->gif类型data的转换,需要将整个动画生成后才能对其做下一步的操作(比如显示动画),但实际上我们还可以通过CADisplayLink实时显示截取对应帧数的区域.

iOS:长图切割并转为动画gif——精灵表单sprite Sheet的转化的更多相关文章

  1. 如何使用动画和精灵表单 Cocos2d-x 2.1.4

            本文实践自 Ray Wenderlich.Tony Dahbura 的文章< How to Use Animations and Sprite Sheets in Cocos2D ...

  2. [一位菜鸟的COCOS-2D编程之路]精灵表单的制作以及简易动画的生成

    1.第一步:使用Zwoptex 制作精灵表单 2.制作的表单的名称为 cocos2Dpng,cocos2D.plist: 3.精灵的动画效果 主要分为五部分. // on "init&quo ...

  3. Cocos2d学习之路三(使用Zwoptex创建精灵表单和CCAnimate动画)

    创建精灵表单: 创建动画先要把图片整合到一个图片上然后生成plist文件: 方法下载Zwoptex软件:http://www.zwopple.com/zwoptex/ 然后打开选择 create ne ...

  4. ios开发之滑动长图截全屏应用

    最近做项目遇到要求截取图片长度超出手机屏幕,即可滑动的长图截屏,这里简单说一下解决思路,下面附带Demo下载地址. ,当我们要截全屏时,将滑动视图的frame以及偏移量记录下来,然后将滑动视图偏移量设 ...

  5. 长图的展开与收起(Android)

    前言: 在app的文章中,经常会夹杂着一些特别长的长图.在阅读的时候需要滑动很久才能看图片下方的文字,因此对于长图只展示图片上面一部分,并且可以展开这个功能是很重要的. 效果: 基本思路: 利用sca ...

  6. web实时长图实践--摘抄

    背景简介 全民K歌专辑发布新玩法,传统宣传专辑战绩的流程,从获取数据,到制作海报,到传播,周期长运营成本高,如何快速分享战绩进行荣誉感的传播成为一个亟待解决的问题. 产品:能不能在专辑大事件触发时,自 ...

  7. iOS 7 present/dismiss转场动画

    前言 iOS 7以后提供了自定义转场动画的功能,我们可以通过遵守协议完成自定义转场动画.本篇文章讲解如何实现自定义present.dismiss自定义动画. 效果图 本篇文章实现的动画切换效果图如下: ...

  8. SurfaceView加载长图

    1:SurfaceView加载长图,移到.可以充当背景 效果截图 2:View (淡入淡出动画没实现:记录下) package com.guoxw.surfaceviewimage; import a ...

  9. MUI - H5实现ios长按图标后进入图标排序及删除功能的效果

    html5实现ios长按图标后进入图标排序及删除功能的效果 我们知道在ios(国产定制安卓系统基本都有)设备上按下图标,图标就会不停的抖动,并且可以随心拖动排序和删除. 那么问题来了,我们怎么通过ht ...

  10. jquery-抖动图组轮播动画

    JQ匀速抖动图组轮播动画 一.HTML+CSS <!DOCTYPE html> <html lang="en" xmlns="http://www.w3 ...

随机推荐

  1. 手把手教你如何构建 WPF 官方开源框架源代码

    从去年微软就将 WPF 开源了,差不多现在所有 WPF 的源代码都开源了.在学习框架的时候,我会做一些改动,期望能构建一个自己的版本进行测试.但是作为一个特别大的框架,想要构建跑起来可不是直接在 Vi ...

  2. 数据可视化之matplotlib模块

    一.简介 Matplotlib是一个强大的Python绘图和数据可视化的工具包.数据可视化也是我们数据分析的最重要的工作之一,可以帮助我们完成很多操作,例如:找出异常值.必要的一些数据转换等.完成数据 ...

  3. STM32中的看门狗

    先复制一段度娘的东西: 在由单片机构成的微型计算机系统中,由于单片机的工作常常会受到来自外界电磁场的干扰,造成程序的跑飞,而陷入死循环,程序的正常运行被打断,由单片机控制的系统无法继续工作,会造成整个 ...

  4. Gem离线包安装

    Gem离线包安装 项目环境 以 rest-client 为例 本地如果是rails项目环境: ruby '2.7.0' gem 'rails', '~> 6.0.3', '>= 6.0.3 ...

  5. Golang从入门到微服务

    学习视频: https://www.bilibili.com/video/BV1Sg411T7TV?p=69 学习资料下载: 链接: https://pan.baidu.com/s/1Yk4GemFR ...

  6. 04.2 go-admin前后端打包为一个服务上线

    目录 一.思路: 二.打包go-admin-ui为静态文件 a.修改配置文件 b.打包 c.复制dist到go-admin的static目录里 三.配置go-admin a.配置路由 b.访问页面 视 ...

  7. Python第三方库的安装和导入

    目录 一.Python第三方库的安装 1. 使用pip命令行安装 2. 使用PyCharm进行安装 3. 下载第三方库文件到本地进行安装 4. 通过国内源进行安装 二.Python第三方库的导入 1. ...

  8. WebKist Inside: CSS 样式表的组成

    1 StyleSheet 一张 StyleSheet 由一系列 Rules 组成,这些 Rules 可以分成 2 大类: 1 Style Rule 2 At-Rule 下面的例子展示了 Style R ...

  9. anaconda安装cv2库

    在安装cv2库之前,需要进行以下准备工作: 安装Anaconda 如果还没有安装Anaconda,可以在官网上下载对应操作系统的Anaconda安装包,然后按照提示进行安装.安装完成后,可以在终端中输 ...

  10. 通过ref返回解决C# struct结构体链式调用的问题

    通常结构体不能进行链式调用,因为返回值是一个新的值,需要赋回原值.但现在通过ref关键字配合扩展方法,也能进行链式调用了. 结构体: public struct Foo { public int a; ...