iOS开发之实现显示gif图片的方法
白羽 2018-06-04 来源 :网络 阅读 1087 评论 0

摘要:本文将带你了解iOS开发之实现显示gif图片的方法,希望本文对大家学IOS有所帮助




我们知道Gif是由一阵阵画面组成的,而且每一帧画面播放的时常可能会不相等,观察上面两个例子,发现他们都没有对Gif中每一帧的显示时常做处理,这样的结果就是整个Gif中每一帧画面都是以固定的速度向前播放,很显然这并不总会符合需求。
 
  于是自己写一个解析Gif的工具类,解决每一帧画面并遵循每一帧所对应的显示时间进行播放。
 
  程序的思路如下:
 
  1、首先使用ImageIO库中的CGImageSource家在Gif文件。
 
  2、通过CGImageSource获取到Gif文件中的总的帧数,以及每一帧的显示时间。
 
  3、通过CAKeyframeAnimation来完成Gif动画的播放。
 
  下面直接上我写的解析和播放Gif的工具类的代码:
 

复制代码代码如下:

//

//  SvGifView.h
//  SvGifSample


//
// 

 Created by maple on 3/28/13.
//  Copyright (c) 2013 smileEvday. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface SvGifView : UIView

/*

 * @brief desingated initializer


 */

- (id)initWithCenter:(CGPoint)center fileURL:(NSURL*)fileURL;

/*

 * @brief start Gif Animation
 */
- (void)startGif;

/*

 * @brief stop Gif Animation
 */
- (void)stopGif;

/*

 * @brief get frames image(CGImageRef) in Gif
 */
+ (NSArray*)framesInGif:(NSURL*)fileURL;


@end


//

//  SvGifView.m
//  SvGifSample


//

//  Created by maple on 3/28/13.
//  Copyright (c) 2013 smileEvday. All rights reserved.
//
#import "SvGifView.h"
#import <ImageIO/ImageIO.h>
#import <QuartzCore/CoreAnimation.h>
/* * @brief resolving gif information */
void getFrameInfo(CFURLRef url, NSMutableArray *frames, NSMutableArray *delayTimes, CGFloat *totalTime,CGFloat *gifWidth, CGFloat *gifHeight)
{
    CGImageSourceRef gifSource = CGImageSourceCreateWithURL(url, NULL);


    
    //

 get frame count
    size_t frameCount = CGImageSourceGetCount(gifSource);
    for (size_t i = 0; i < frameCount; ++i) {


        //

get each frame
        CGImageRef frame = CGImageSourceCreateImageAtIndex(gifSource, i, NULL);
        [frames addObject:(id)frame];
        CGImageRelease(frame);


        
        //

 get gif info with each frame
        NSDictionary *dict = (NSDictionary*)CGImageSourceCopyPropertiesAtIndex(gifSource, i, NULL);
        NSLog(@"kCGImagePropertyGIFDictionary %@", [dict valueForKey:(NSString*)kCGImagePropertyGIFDictionary]);


        
        //

get gif size
        if (gifWidth != NULL && gifHeight != NULL) {
            *gifWidth = [[dict valueForKey:(NSString*)kCGImagePropertyPixelWidth] floatValue];
            *gifHeight = [[dict valueForKey:(NSString*)kCGImagePropertyPixelHeight] floatValue];
        }


        //

kCGImagePropertyGIFDictionary中kCGImagePropertyGIFDelayTime,kCGImagePropertyGIFUnclampedDelayTime值是一样的
        NSDictionary *gifDict = [dict valueForKey:(NSString*)kCGImagePropertyGIFDictionary];
        [delayTimes addObject:[gifDict valueForKey:(NSString*)kCGImagePropertyGIFDelayTime]];
        
        if (totalTime) {
            *totalTime = *totalTime + [[gifDict valueForKey:
(NSString*)kCGImagePropertyGIFDelayTime] floatValue];

        }
    }
}

@interface SvGifView() {
    NSMutableArray *_frames;
    NSMutableArray *_frameDelayTimes;
    
    CGFloat _totalTime;         // seconds
    CGFloat _width;
    CGFloat _height;


}

@end
@implementation SvGifView
- (id)initWithCenter:(CGPoint)center fileURL:(NSURL*)fileURL;{
  self = [super initWithFrame:CGRectZero];
    if (self) {


        
      

  _frames = [[NSMutableArray alloc] init];
        _frameDelayTimes = [[NSMutableArray alloc] init];
        
        _width = 0;
        _height = 0;
        
        if (fileURL) {
            getFrameInfo((CFURLRef)fileURL, _frames, _frameDelayTimes, &_totalTime, &_width, &_height);


        }
        
  

      self.frame = CGRectMake(0, 0, _width, _height);
        self.center = center;


    }
    
   

 return self;

}

+ (NSArray*)framesInGif:(NSURL *)fileURL


{
  

  NSMutableArray *frames = [NSMutableArray arrayWithCapacity:3];
NSMutableArray *delays = [NSMutableArray arrayWithCapacity:3];
    
    getFrameInfo
((CFURLRef)fileURL, frames, delays, NULL, NULL, NULL);
  return frames;

}

- (void)startGif


{
   

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"contents"];
  NSMutableArray *times = [NSMutableArray arrayWithCapacity:3];
    CGFloat currentTime = 0;
    int count = _frameDelayTimes.count;
    for (int i = 0; i < count; ++i) {
    [times addObject:[NSNumber numberWithFloat:(currentTime / _totalTime)]];
        currentTime += [[_frameDelayTimes objectAtIndex:i] floatValue];
    }
 [animation setKeyTimes:times];
    
    NSMutableArray *images = [NSMutableArray arrayWithCapacity:3];
    for (int i = 0; i < count; ++i) {
        [images addObject:[_frames objectAtIndex:i]];


    }
    
 

   [animation setValues:images];
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]];
    animation.duration = _totalTime;
    animation.delegate = self;
    animation.repeatCount = 5;
[self.layer addAnimation:animation forKey:@"gifAnimation"];}
- (void)stopGif


{
    [

self.layer removeAllAnimations];}
// remove contents when animation end- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{    self.layer.contents = nil;


}

//

Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code


}


@end


  

代码很短也比较容易,就不一一解释了。最开始的那个C函数主要就是用来解析Gif的,之所以用C函数是因为我要返回多个信息,而Objective-c只能返回一个参数,而且Objective-c和C语言可以很方便的混合编程。
另外再介绍两种使用UIImageView的方法:
1. 使用UIWebView播放
复制代码代码如下:


    //

设定位置和大小
    CGRect frame = CGRectMake(50,50,0,0);
    frame.size = [UIImage imageNamed:@"guzhang.gif"].size;
    // 读取gif图片数据
    NSData *gif = [NSData dataWithContentsOfFile: [[NSBundle mainBundle] pathForResource:@"guzhang" ofType:@"gif"]];
    // view生成
    UIWebView *webView = [[UIWebView alloc] initWithFrame:frame];
    webView.userInteractionEnabled = NO;//用户不可交互
    [webView loadData:gif MIMEType:@"image/gif" textEncodingName:nil baseURL:nil];
    [self.view addSubview:webView];
    [webView release];

2.将gif图片分解成多张png图片,使用UIImageView播放。
代码如下:

复制代码代码如下:

UIImageView *gifImageView = [[UIImageView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    NSArray *gifArray = [NSArray arrayWithObjects:[UIImage
imageNamed:@"1"],
                                                  [UIImage
imageNamed:@"2"],
                                                  [UIImage
imageNamed:@"3"],
                                                  [UIImage
imageNamed:@"4"],
                                                  [UIImage
imageNamed:@"5"],
                                                  [UIImage
imageNamed:@"6"],
                                                  [UIImage
imageNamed:@"7"],
                                                  [UIImage
imageNamed:@"8"],
                                                  [UIImage
imageNamed:@"9"],
                                                  [UIImage
imageNamed:@"10"],
                                                  [UIImage
imageNamed:@"11"],
                                                  [UIImage
imageNamed:@"12"],
                                                  [UIImage
imageNamed:@"13"],
                                                  [UIImage
imageNamed:@"14"],
                                                  [UIImage
imageNamed:@"15"],
                                                  [UIImage
imageNamed:@"16"],
                                                  [UIImage
imageNamed:@"17"],
                                                  [UIImage
imageNamed:@"18"],
                                                  [UIImage
imageNamed:@"19"],
                                                  [UIImage
imageNamed:@"20"],
                                                  [UIImage
imageNamed:@"21"],
                                                  [UIImage
imageNamed:@"22"],nil];
    gifImageView.animationImages = gifArray; //动画图片数组
    gifImageView.animationDuration = 5; //执行一次完整动画所需的时长
    gifImageView.animationRepeatCount = 1;  //动画重复次数
    [gifImageView startAnimating];
    [self.view addSubview:gifImageView];
    [gifImageView release];


注意:这个方法,如果gif动画每桢间的时间间隔不同,不能达到此效果。



本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之IOS频道!


本文由 @白羽 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程