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. [ELK] 生产环境中 Elasticsearch 的重要配置项

    配置 Elasticsearch https://www.elastic.co/guide/en/elasticsearch/reference/current/settings.html 重要的 E ...

  2. JS代码优化小技巧

    下面介绍一种JS代码优化的一个小技巧,通过动态加载引入js外部文件来提高网页加载速度 [基本优化] 将所有需要的<script>标签都放在</body>之前,确保脚本执行之前完 ...

  3. 2024 CKA考试

    一.考试形式 第一次考试可能有点紧张,训练时1小时不到搞定,考试用了1个半小时,记得考试前多练几次题目,就算紧张也可以在120分钟里考完,可以记住关键词去kubernetes.io中查找 考试模式:线 ...

  4. RT-Thead移植时缺少SystemCoreClockUpdate函数

    一.问题 在移植 RT-Thead 时,需要获取mcu当前的 HCLK 时钟频率来设置滴答时钟,而我使用的库函数中刚好缺少SystemCoreClockUpdate函数. 我之前在RT-Thread移 ...

  5. JS基础--JavaScript实例集锦(初学)

    1.子节点childNodes: <!DOCTYPE html> <html> <head> <title>childNodes</title&g ...

  6. echarts下划线实现

    echarts中无下划线实现,我采用图片填充文本块背景的方式实现 这是从 长空雁叫霜晨月 的博客中得到启发https://www.cnblogs.com/volodya/p/Echarts.html ...

  7. Asp-Net-Core开发笔记:给SwaggerUI加上登录保护功能

    前言 在 SwaggerUI 中加入登录验证,是我很早前就做过的,不过之前的做法总感觉有点硬编码,最近 .Net8 增加了一个新特性:调用 MapSwagger().RequireAuthorizat ...

  8. linux下使用fdisk进行磁盘分区详解

    目录 一.前言 二.关于磁盘分区的结构 三.fdisk命令详解 四.使用fdisk进行磁盘分区 4.1 磁盘分区规划 4.2 fdisk进行磁盘分区 4.3 格式化分区 4.4 创建挂载点/挂载目录 ...

  9. 牛逼:一张900w的数据表,17s执行的SQL优化到300ms?

    转载自   https://mp.weixin.qq.com/s/ru_B1aI0YrpXeSl-J01sHQ

  10. 一文搞懂 MySQL 日志

    前言 MySQL 的日志记录了运行的各种信息,是 MySQL 事务.性能.数据容灾.异常排查等的基础.本文将介绍 MySQL 一些关键日志的作用和原理. MySQL InnoDB 引擎重要的三个日志: ...