SoFunction
Updated on 2025-04-12

N ways to display iOS Gif image (native + third-party)

This article shares N ways to display iOS Gif image for your reference. The specific content is as follows

Native method:


Features: The loading speed is slightly longer, the performance is better, and the gif dynamic pictures played are smoother.

//Dynamic display of GIF pictures-WebView-(void)showGifImageWithWebView{
 //Read gif image data NSData *gifData = [NSData dataWithContentsOfFile: [[NSBundle mainBundle] pathForResource:@"earthGif" ofType:@"gif"]];
 //UIWebView generation UIWebView *imageWebView = [[UIWebView alloc] initWithFrame:CGRectMake(112, 302, 132, 102)];
 //Users are not interactive  = NO;
 //Load gif data [imageWebView loadData:gifData MIMEType:@"image/gif" textEncodingName:nil baseURL:nil];
 //Add this gif control in the view [ addSubview:imageWebView];
}


The loading method is faster, and the performance is not as good as UIWebView. Advantages: Easy to expand

1)
Add a category of UIImageView and add two methods
UIImage+Tool
.h

#import <UIKit/>

@interface UIImageView (Tool)

/** Methods to parse gif file data will pass the parsed data in the block */
-(void)getGifImageWithUrk:(NSURL *)url returnData:(void(^)(NSArray<UIImage *> * imageArray,NSArray<NSNumber *>*timeArray,CGFloat totalTime, NSArray<NSNumber *>* widths, NSArray<NSNumber *>* heights))dataBlock;

/** Add a method to set the content of the gif diagram for UIImageView: */
-(void)yh_setImage:(NSURL *)imageUrl;

@end

.m

//
// UIImageView+
// OneHelper
//
// Created by qiuxuewei on 16/3/2.
// Copyright © 2016 Qiu Xuewei. All rights reserved.//

#import "UIImageView+"
//Introduce ImageIO library#import <ImageIO/>

@implementation UIImageView (Tool)



//The method to parse gif file data will pass the parsed data in the block-(void)getGifImageWithUrk:(NSURL *)url returnData:(void(^)(NSArray<UIImage *> * imageArray, NSArray<NSNumber *>*timeArray,CGFloat totalTime, NSArray<NSNumber *>* widths,NSArray<NSNumber *>* heights))dataBlock{
 // Read the gif file as an image data reference through the url of the file CGImageSourceRef source = CGImageSourceCreateWithURL((CFURLRef)url, NULL);
 //Get the number of pictures in the gif file size_t count = CGImageSourceGetCount(source);
 //Define a variable to record the time when the gif plays a round float allTime=0;
 //Storage all pictures NSMutableArray * imageArray = [[NSMutableArray alloc]init];
 //Storage the playback time of each frame NSMutableArray * timeArray = [[NSMutableArray alloc]init];
 //Storage the width of each image (usually in a gif file, all images will be the same) NSMutableArray * widthArray = [[NSMutableArray alloc]init];
 //The height of each picture NSMutableArray * heightArray = [[NSMutableArray alloc]init];
 //Travel for (size_t i=0; i<count; i++) {
  CGImageRef image = CGImageSourceCreateImageAtIndex(source, i, NULL);
  [imageArray addObject:(__bridge UIImage *)(image)];
  CGImageRelease(image);
  //Get picture information  NSDictionary * info = (__bridge NSDictionary*)CGImageSourceCopyPropertiesAtIndex(source, i, NULL);
  CGFloat width = [[info objectForKey:(__bridge NSString *)kCGImagePropertyPixelWidth] floatValue];
  CGFloat height = [[info objectForKey:(__bridge NSString *)kCGImagePropertyPixelHeight] floatValue];
  [widthArray addObject:[NSNumber numberWithFloat:width]];
  [heightArray addObject:[NSNumber numberWithFloat:height]];
  NSDictionary * timeDic = [info objectForKey:(__bridge NSString *)kCGImagePropertyGIFDictionary];
  CGFloat time = [[timeDic objectForKey:(__bridge NSString *)kCGImagePropertyGIFDelayTime]floatValue];
  allTime+=time;
  [timeArray addObject:[NSNumber numberWithFloat:time]];
 }
 dataBlock(imageArray,timeArray,allTime,widthArray,heightArray);
}

//Add a method to set the content of the gif diagram for UIImageView:-(void)yh_setImage:(NSURL *)imageUrl{
 __weak id __self = self;
 [self getGifImageWithUrk:imageUrl returnData:^(NSArray<UIImage *> *imageArray, NSArray<NSNumber *> *timeArray, CGFloat totalTime, NSArray<NSNumber *> *widths, NSArray<NSNumber *> *heights) {
  //Add frame animation  CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"contents"];
  NSMutableArray * times = [[NSMutableArray alloc]init];
  float currentTime = 0;
  //Set the time ratio of each frame  for (int i=0; i<; i++) {
   [times addObject:[NSNumber numberWithFloat:currentTime/totalTime]];
   currentTime+=[timeArray[i] floatValue];
  }
  [animation setKeyTimes:times];
  [animation setValues:imageArray];
  [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]];
  //Set the loop  = MAXFLOAT;
  //Set the total playback time   = totalTime;
  //Add Layer layer  [[(UIImageView *)__self layer]addAnimation:animation forKey:@"gifAnimation"];
 }];
}

@end

Used where the gif is loaded
Import UIImageView+Tool

-(void)showGifImageWithImageView{

 UIImageView * imageView = [[UIImageView alloc]initWithFrame:CGRectMake(112, 342, 132, 102)];
 NSURL * url = [[NSURL alloc]initFileURLWithPath:[[NSBundle mainBundle] pathForResource:@"" ofType:nil]];
 [imageView yh_setImage:url];
 [ addSubview:imageView];

}

Third party:

github link:/liyong03/YLGIFImage

#import ""
#import ""

-(void)showGifImageWithYLImageView{
 YLImageView* imageView = [[YLImageView alloc] initWithFrame:CGRectMake(112, 342, 132, 102)];
 CGFloat centerX = ;
 [imageView setCenter:CGPointMake(centerX, 402)];
 [ addSubview:imageView];
  = [YLGIFImage imageNamed:@""];
}


github link:/Flipboard/FLAnimatedImage

-(void)showGifImageWithFLAnimatedImage{
 //GIF to NSData //Gif path NSString *pathForFile = [[NSBundle mainBundle] pathForResource: @"earthGif" ofType:@"gif"];
 //Convert to NSData NSData *dataOfGif = [NSData dataWithContentsOfFile: pathForFile];
 //Initialize the FLAnimatedImage object FLAnimatedImage *image = [FLAnimatedImage animatedImageWithGIFData:dataOfGif];
 //Initialize the FLAnimatedImageView object FLAnimatedImageView *imageView = [[FLAnimatedImageView alloc] init];
 //Set GIF pictures  = image;
  = CGRectMake(112, 342, 132, 102);
 [ addSubview:imageView];
}

The above is all about this article, I hope it will be helpful to everyone's learning.