YYImage动画 - YYKit组件之一

特性

• 支持以下类型静态图像的显示/编码/解码:
  WebP, PNG, GIF, JPEG, JP2, TIFF, BMP, ICO, ICNS。
• 支持以下类型动画图像的播放/编码/解码:
  WebP, APNG, GIF。
• 支持以下类型图片的渐进式/逐行扫描/隔行扫描解码:
  PNG, GIF, JPEG, BMP。
• 支持多张图片构成的帧动画播放，支持单张图片的 sprite sheet 动画。
• 高效的动态内存缓存管理，以保证高性能低内存的动画播放。
• 完全兼容 UIImage 和 UIImageView，使用方便。
• 保留可扩展的接口，以支持自定义动画。
• 每个类和方法都有完善的文档注释。

用法

显示动画类型的图片

// 文件: [email protected]
UIImage *image = [YYImage imageNamed:@"ani.gif"];
UIImageView *imageView = [[YYAnimatedImageView alloc] initWithImage:image];
[self.view addSubview:imageView];

播放帧动画

// 文件: frame1.png, frame2.png, frame3.png
NSArray *paths = @[@"/ani/frame1.png", @"/ani/frame2.png", @"/ani/frame3.png"];
NSArray *times = @[@0.1, @0.2, @0.1];
UIImage *image = [YYFrameImage alloc] initWithImagePaths:paths frameDurations:times repeats:YES];
UIImageView *imageView = [YYAnimatedImageView alloc] initWithImage:image];
[self.view addSubview:imageView];

播放 sprite sheet 动画

// 8 * 12 sprites in a single sheet image
UIImage *spriteSheet = [UIImage imageNamed:@"sprite-sheet"];
NSMutableArray *contentRects = [NSMutableArray new];
NSMutableArray *durations = [NSMutableArray new];
for (int j = 0; j < 12; j++) {
   for (int i = 0; i < 8; i++) {
       CGRect rect;
       rect.size = CGSizeMake(img.size.width / 8, img.size.height / 12);
       rect.origin.x = img.size.width / 8 * i;
       rect.origin.y = img.size.height / 12 * j;
       [contentRects addObject:[NSValue valueWithCGRect:rect]];
       [durations addObject:@(1 / 60.0)];
   }
}
YYSpriteSheetImage *sprite;
sprite = [[YYSpriteSheetImage alloc] initWithSpriteSheetImage:img
                                                contentRects:contentRects
                                              frameDurations:durations
                                                   loopCount:0];
YYAnimatedImageView *imageView = [YYAnimatedImageView new];
imageView.size = CGSizeMake(img.size.width / 8, img.size.height / 12);
imageView.image = sprite;
[self.view addSubview:imageView];

动画播放控制

YYAnimatedImageView *imageView = ...;
// 暂停:
[imageView stopAnimating];
// 播放:
[imageView startAnimating];
// 设置播放进度:
imageView.currentAnimatedImageIndex = 12;
// 获取播放状态:
image.currentIsPlayingAnimation;
//上面两个属性都支持 KVO。

图片解码

// 编码静态图 (支持各种常见图片格式):
YYImageEncoder *jpegEncoder = [[YYImageEncoder alloc] initWithType:YYImageTypeJPEG];
jpegEncoder.quality = 0.9;
[jpegEncoder addImage:image duration:0];
NSData jpegData = [jpegEncoder encode];
 
// 编码动态图 (支持 GIF/APNG/WebP):
YYImageEncoder *webpEncoder = [[YYImageEncoder alloc] initWithType:YYImageTypeWebP];
webpEncoder.loopCount = 5;
[webpEncoder addImage:image0 duration:0.1];
[webpEncoder addImage:image1 duration:0.15];
[webpEncoder addImage:image2 duration:0.2];
NSData webpData = [webpEncoder encode];

图片类型探测

// 获取图片类型
YYImageType type = YYImageDetectType(data); 
if (type == YYImageTypePNG) ...

安装

CocoaPods

1. 将 cocoapods 更新至最新版本.
2. 在 Podfile 中添加 pod 'YYImage'。
3. 执行 pod install 或 pod update。
4. 导入 。
5. 注意：pod 配置并没有包含 WebP 组件, 如果你需要支持 WebP，可以在 Podfile 中添加 pod 'YYImage/WebP'。

Carthage

1. 在 Cartfile 中添加 github "ibireme/YYImage"。
2. 执行 carthage update --platform ios 并将生成的 framework 添加到你的工程。
3. 导入 。
4. 注意：carthage framework 并没有包含 WebP 组件。如果你需要支持 WebP，可以用 CocoaPods 安装，或者手动安装。

手动安装

3. 下载 YYImage 文件夹内的所有内容。
4. 将 YYImage 内的源文件添加(拖放)到你的工程。
5. 链接以下 frameworks:
   • UIKit
   • CoreFoundation
   • QuartzCore
   • AssetsLibrary
   • ImageIO
   • Accelerate
   • MobileCoreServices
   • libz
6. 导入 YYImage.h。
7. 注意：如果你需要支持 WebP，可以将Vendor/WebP.framework(静态库) 加入你的工程。

常见问题

Q: 为什么我不能显示 WebP 图片？
A: 确保 WebP.framework 已经被添加到你的工程内了。你可以调用 YYImageWebPAvailable() 来检查一下 WebP 组件是否被正确安装。

Q: 为什么我不能播放 APNG 动画？
A: 你应该禁用 Build Settings 中的 Compress PNG Files 和 Remove Text Metadata From PNG Files. 或者你也可以把 APNG 文件的扩展名改为apng.

相关连接

移动端图片格式调研
iOS 处理图片的一些小 Tip
GitHub位置