iOS加載Gif動態圖

1、Gif在iOS開發中的說明

• Gif 圖片是非常常見的圖片格式，尤其是在聊天的過程中，Gif 表情使用地很頻繁。但是 iOS 沒有現成的支持加載和播放 Gif 的類。

2、加載本地Gif

• 2.1 SDWebImage加載

  • 在 SDWebImage 這個庫里有一個 UIImage+GIF 的類別，里面為 UIImage 擴展了三個方法。

  @interface UIImage (GIF)
  + (IImage *)sd_animatedGIFNamed:(NSString *)name;
  + (UIImage *)sd_animatedGIFWithData:(NSData *)data;
  - (UIImage *)sd_animatedImageByScalingAndCroppingToSize:(CGSize)size;
  @end
  

  • 我們要獲取處理后的 Gif 圖片，其實只要調用前面兩個中的其中一個方法就行了，注意，第一個只需要傳 Gif 的名字，而不需要帶擴展名（如 Gif 圖片名字為 demo_gif_001.gif，只需傳 demo_gif_001 即可)。

  #import "UIImage+GIF.h"
  
  UIImageView *sImg = [[UIImageView alloc] init];
  [self addSubview:sImg];
  sImg.frame = CGRectMake(30, 50, 400, 300);
  
  NSString *filePath = [[NSBundle bundleWithPath:[[NSBundle mainBundle] bundlePath]] pathForResource:@"demo_gif_001" ofType:@"gif"];
  NSData *imageData = [NSData dataWithContentsOfFile:filePath];
  sImg.image = [UIImage sd_animatedGIFWithData:imageData];
  

  • 注意：gif 圖片不要放在 .xcassets 資源文件夾下，否則加載不出來。
  • 效果
    

• 2.2 使用 UIWebView 加載

  • 使用 UIWebView 的弊端在於，不能設置 Gif 動畫的播放時間，不能自動縮放 Gif 動圖。

  // 讀取 GIF 圖片數據
  NSData *data = [NSData dataWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"demo3" ofType:@"gif"]];
  
  // 加載 GIF 動圖
  UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, 200)];
  [webView loadData:data MIMEType:@"image/gif" textEncodingName:@"" baseURL:[NSURL URLWithString:@""]];
  
  [self.view addSubview:webView];
  

• 2.3 使用 QExtension 加載

// 通過名稱加載 gif 圖片，不需要寫擴展名
self.imageView.image = [UIImage q_gifImageNamed:@"demo3"];

// 通過數據加載 gif 圖片
NSData *imageData = [NSData dataWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"demo3" ofType:@"gif"]];
self.imageView.image = [UIImage q_gifImageWithData:imageData];

• 效果
  

• 2.4 將 Gif 動圖拆分成多張圖片，使用 UIImageView 播放

  • 最好把所需要的 Gif 圖片打包到 Bundle 文件內。下拉、上拉加載控件需要一個根據拉動距離設置特定的 Image，一般使用該方法。

  - (NSArray *)animationImages {
  	NSFileManager *fielM = [NSFileManager defaultManager];
  	NSString *path = [[NSBundle mainBundle] pathForResource:@"Loading" ofType:@"bundle"];
  	NSArray *arrays = [fielM contentsOfDirectoryAtPath:path error:nil];
  
  	NSMutableArray *imagesArr = [NSMutableArray array];
  	for (NSString *name in arrays) {
  		UIImage *image = [UIImage imageNamed:[(@"Loading.bundle") stringByAppendingPathComponent:name]];
  		if (image) {
  			[imagesArr addObject:image];
  		}
  	}
  	return imagesArr;
  }
  
  - (void)viewDidLoad {
  	[super viewDidLoad];
  
  	UIImageView *gifImageView = [[UIImageView alloc] initWithFrame:frame];
  	gifImageView.animationImages = [self animationImages]; // 獲取 Gif 圖片列表
  	gifImageView.animationDuration = 5;                    // 執行一次完整動畫所需的時長
  	gifImageView.animationRepeatCount = 1;                 // 動畫重復次數
  	[gifImageView startAnimating];
  	[self.view addSubview:gifImageView];
  }
  

2、加載網絡 GIF 動圖

• 2.1 使用 SDWebImage 加載

  • 加載網絡的 Gif 文件就簡單多了。最簡單的方法，我們只需要使用 SDWebImage 的 sd_setImageWithURL: 這個方法傳入 Gif 文件是 url 地址即可。

  NSURL *url = [NSURL URLWithString:@"http://images.cnblogs.com/cnblogs_com/QianChia/934664/o_QExtension31.gif"];
  [self.imageView sd_setImageWithURL:url];
  

  • SDWebImage 內部實現大概是以下幾個步驟：
    • 1、SDWebImage 根據 url 將 Gif 文件下載下來，格式為一個 NSData。
    • 2、如果判斷是 Gif 格式，則會調用 sd_animatedGIFWithData: 將 Data 轉換成我們需要的 Gif 格式。
    • 3、通過上面的方法二即可顯示出 Gif 圖片。

  UIImage *image = [UIImage sd_animatedGIFWithData:data];
  gifImageView.image = image;