《iOS 三问》 -- iOS 动画之帧动画

1 概述

实际上,除了在 动画概述 中所说的动画的插值实现方法,还有一种最原始的方法 – 帧动画。

想像下我们以前常做的事情,在每一页书的书角画连续的小人,然后把书角连续快速地翻动 – 这时小人动起来了! – 这就是最原始的动画 帧动画 了~

2 使用 UIImageView 设置帧动画

UIImageView 已经帮我们封装好了帧动画,操作起来一切都那么简单。我们只要把图片帧加载作 UIImage 数组,然后赋给 UIImage 的 animationImageshighlightedAnimationImages,然后就可以把一切交给 iOS 处理了。我们只需要调用:

1
2
[imgView startAnimation]; // 开始帧动画
[imgView stopAnimation]; // 结束帧动画

UIImageView 还提供了一些对动画进行配置的属性和方法:

1
2
3
imageView.animationImages;  // 设置帧动画的图片源
imageView.animationDuration; // 动画持续时间
imageView.animationRepeatCount; // 动画重复的次数

2.1 示例

1
2
3
4
5
6
7
8
9
10
11
NSMutableArray<UIImage *> *images = [NSMutableArray arrayWithCapacity:10];
for (int i = 1; i <= 5; i ++) {
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"loading_%d",i]];
[images addObject:img];
}

UIImageView *iv = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"loading_1"]];
iv.animationImages = images;
iv.animationDuration = 1;
iv.animationRepeatCount = 0; // 无限重复
[iv startAnimating];

3 可播放动画的 UIImage

通过 UIImage 的类方法 animatedImageWithImages:duration 可以将一个 UIImage 设置成一个自动播放动画的 UIImage。你可以将设置好的 image 用于 UIImageView 或是 Button 都可以,一旦设置这些控件的图片源是动画 Image 后,你设置的动画就会自动循环播放。

动画 image 一旦显示后是不能停止的,会一直循环播放下去~适合用于图片加载中的显示或按钮正在操作中的转菊花。

3.1 示例

1
2
UIImage *animImg = [UIImage animatedImageWithImages:images duration:0.5];
UIImageView *iv = [[UIImageView alloc] initWithImage:animImg];

4 引用

【1】[Matt Neuburg - 《Programming iOS deep into views,view controllers and frameworks》]