iOS:關于加載GIF圖片的思考

• 前言
• GIF原理
• 加載方式
• • UIImageView
  • SDWebImage
  • QExtension
  • WKWebView
  • YYImage
• 總結
• • 素材

前言

最近在項目中需要加入一個動畫效果，設計師在導出Lottie動畫后發現并不能達到效果，就想使用gif圖片來實現。
但是將gif圖片放入項目中運行時發現了一些問題，所以在這里整理一下有關加載gif圖片的問題！
以下觀點都是作者個人進行了不嚴謹的簡單測試得出的結論，如有錯誤請多多包涵，歡迎討論！

GIF原理

GIF的全稱是Graphics Interchange Format，可譯為圖形交換格式，用于以超文本標志語言（Hypertext Markup Language）方式顯示索引彩色圖像，在因特網和其他在線服務系統上得到廣泛應用。GIF是一種公用的圖像文件格式標準，版權歸Compu Serve公司所有。
詳細去讀GIF百度百科即可，我們不必深究。簡單的將GIF理解為循環播放的幻燈片（個人見解）。

加載方式

UIImageView

SDWebImage

QExtension

WKWebView

YYImage
就以下5種方式進行討論，最終還是選擇了YYImage進行實現！具體如下：

UIImageView

系統提供的UIimageView是支持多張圖片的播放的，類似于播放幻燈片，但是這樣就需要先將*.gif*文件先進行抽幀為單獨的幀圖片，再進行播放，很麻煩！但是實現確實很簡單的，如果只是少數幾張圖片的切換的話，還是可以選擇的。

#pragma mark - eg UIImageView *gifImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 400, 300)]; gifImageView.animationImages = @[]; // 存放每一幀的UIImage的數組 gifImageView.animationDuration = 5; // 執行一次完整動畫所需的時長 gifImageView.animationRepeatCount = 1;// 動畫重復次數 [gifImageView startAnimating]; [self.view addSubView:gifImageView]; #pragma mark - UIImageView Api @property (nonatomic, getter=isHighlighted) BOOL highlighted API_AVAILABLE(ios(3.0)); // default is NO // these allow a set of images to be animated. the array may contain multiple copies of the same @property (nullable, nonatomic, copy) NSArray<UIImage *> *animationImages; // The array must contain UIImages. Setting hides the single image. default is nil @property (nullable, nonatomic, copy) NSArray<UIImage *> *highlightedAnimationImages API_AVAILABLE(ios(3.0)); // The array must contain UIImages. Setting hides the single image. default is nil @property (nonatomic) NSTimeInterval animationDuration; // for one cycle of images. default is number of images * 1/30th of a second (i.e. 30 fps) @property (nonatomic) NSInteger animationRepeatCount; // 0 means infinite (default is 0) // When tintColor is non-nil, any template images set on the image view will be colorized with that color. // The tintColor is inherited through the superview hierarchy. See UIView for more information. @property (null_resettable, nonatomic, strong) UIColor *tintColor API_AVAILABLE(ios(7.0)); - (void)startAnimating; - (void)stopAnimating; @property(nonatomic, readonly, getter=isAnimating) BOOL animating;

SDWebImage

SDWebImage可以說是加載圖片的常用三方庫了，嘗試著使用了一下，但是卻發現了很嚴重的內存占用問題。加載一次GIF在高幀數的情況下內存直接暴漲了近200M有的100多M，這肯定是不推薦使用了！

#import <SDWebImage/UIImage+GIF.h> #pragma mark - eg // 注意 UIImageView *gifImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 400, 300)]; NSString *filePath = [[NSBundle bundleWithPath:[[NSBundle mainBundle] bundlePath]] pathForResource:@"test" ofType:@"gif"]; NSData *imageData = [NSData dataWithContentsOfFile:filePath]; gifImageView.image = [UIImage sd_imageWithGIFData:imageData]; [self.view addSubView:gifImageView];

QExtension

QExtension是一個對很多類進行了拓展的三方，提供了很多方法，但是只有較少人使用，同樣在使用時發生了和SDWebImage一樣的內存問題，所以并不推薦使用！

#import <QExtension/UIImage+GIF.h> #pragma mark - eg // 注意 UIImageView *gifImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 400, 300)]; NSString *filePath = [[NSBundle bundleWithPath:[[NSBundle mainBundle] bundlePath]] pathForResource:@"test" ofType:@"gif"]; NSData *imageData = [NSData dataWithContentsOfFile:filePath]; gifImageView.image = [UIImage q_gifImageWithData:imageData]; [self.view addSubView:gifImageView];

WKWebView

系統的WKWebView也是可以對GIF的數據進行展示的，而且在內存方面就友好很多，不會暴漲，我在測試時 漲了7M。使用起來也很簡單，只是少量的需求，且不想引入更多三方的話，可以考慮使用！

#import <WebKit/WebKit.h> #pragma mark - eg WKWebView *gifView = [[WKWebView alloc] initWithFrame:CGRectMake(0, 0, 400, 300)]; NSString *filePath = [[NSBundle bundleWithPath:[[NSBundle mainBundle] bundlePath]] pathForResource:@"test" ofType:@"gif"]; NSData *imageData = [NSData dataWithContentsOfFile:filePath]; [gifView loadData:imageData MIMEType:@"image/gif" characterEncodingName:@"" baseURL:[NSURL URLWithString:@""]]; [self.view addSubView:gifView];

YYImage

YYImage也可以說是很出名的一個三方了，它對UIimageView和UIImage都進行了很好的擴展，在播放GIF圖片上的優化也是做的很好！由于是對UIimageView的擴展，它具有所有UIimageView的特性，兼容性很好！我在測試時內存漲了6M。

#import <YYImage/YYImage.h> #pragma mark - eg UIImageView *gifImageView = [[YYAnimatedImageView alloc] initWithFrame:CGRectMake(0, 0, 400, 300)]; UIImage *img = [YYImage imageNamed:@"test.gif"]; gifImageView.image = img; [self.view addSubView:gifImageView];

GIF圖片直接放在Bundle里就可以了！

總結

UIImageView
優點：原生
缺點：使用復雜，無法直接加載.gif文件

SDWebImage
優點：使用簡單方便
缺點：需要引入三方、內存爆炸！！！

QExtension
優點：使用簡單方便
缺點：需要引入三方、不常用、內存爆炸！！！

WKWebView
優點：原生、使用簡單、兼容性好
缺點：無明顯缺點

YYImage
優點：使用簡單、兼容性好
缺點：需要引入三方

素材

總結

以上是生活随笔為你收集整理的iOS:关于加载GIF图片的思考的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。