在之前做雪花下落的时候我们用到了定时器让雪花下落，然后使用UIView动画让雪花在下落的过程中移动。今天看一下另一种简单的图片动画。
我们先以火焰燃烧的效果为例，先看一下效果：
来看实现：
//现在头文件中声明一个图片视图的全局变量
@interface ViewController (){
UIImageView *imageView;
}
@end
- (void)animationFire1{
// 1.创建视图对象
imageView = [[UIImageView alloc] initWithFrame:self.view.frame];
imageView.image = [UIImage imageNamed:@"campFire01.gif"];
[self.view addSubview:imageView];
// 开启定时器
[NSTimer scheduledTimerWithTimeInterval:0.2 target:self selector:@selector(animationFire1OnTimer) userInfo:nil repeats:YES];
}
static int i = 0;
- (void)animationFire1OnTimer{
i++;
imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"campFire%02d.gif",i]];
if (i == 17) {
i=0;
}
}
这里我们依然是使用的是定时器，在定时器每次执行的时候改变图片视图中的图片内容，就造成了视觉上的效果，我们这里是每次在定时器里读取资源文件，可以做一下调整，将资源文件先读进内存中在执行：
//先创建一个数组
@interface ViewController (){
UIImageView *imageView;
NSMutableArray *array;
}
@end
- (void)animationFire2{
[super viewDidLoad];
// 1.创建视图对象
imageView = [[UIImageView alloc] initWithFrame:self.view.frame];
imageView.image = [UIImage imageNamed:@"campFire01.gif"];
[self.view addSubview:imageView];
array = [[NSMutableArray alloc] initWithCapacity:0];
for (int i = 1; i < 18; i++){
UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"campFire%02d.gif",i]];
[array addObject:image];
}
// 开启定时器
[NSTimer scheduledTimerWithTimeInterval:0.2 target:self selector:@selector(animationFire2OnTimer) userInfo:nil repeats:YES];
}
static int i = 0;
- (void)animationFire2OnTimer{
imageView.image = [array objectAtIndex:i];
i++;
if (i>=17){
i = i%17;
}
}
这里的效果是一样的，但是其实系统给我提供了一些方法来实现这种效果，来看一下我们将要做的简单打飞机中用到的动画：
//现在头文件中声明一个图片视图的全局变量
@interface ViewController (){
UIImageView *imageView;
}
@end
- (void)animationPlaneBoom{
self.view.backgroundColor = [UIColor grayColor];
//创建图片数组
NSArray *imageArray = [NSArray arrayWithObjects:[UIImage imageNamed:@"DJBob1"],[UIImage imageNamed:@"DJBob2"],[UIImage imageNamed:@"DJBob3"],nil];
imageView = [[UIImageView alloc] initWithFrame:CGRectMake(50, 100, 200, 200)];
//设置图片的数组
imageView.animationImages = imageArray;
//设置一个循环的持续时间
imageView.animationDuration = 0.5;
//设置重复的次数
imageView.animationRepeatCount = 0;
[self.view addSubview:imageView];
//开始动画
[imageView startAnimating];
}
其实就是三张图片连续变换，造成了飞机爆照的效果
以上就是简单的图片动画实现，其实就是大量图片的变换而已。
九宫格使我们常用的一种UI排布算法，现在很多的软件界面都在使用九宫格排布，我们先看一下九宫格的实现思路
下面我们看一下九宫格的算法的实现
- (void)nineButtons{
// 获取每个间隔的大小
float xInterval = (320 - 3*50)/4;
float yInterval = (480 - 3*50)/4;
for (int i = 0; i < 9; i++){
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
// 0 1 2 3 4 5 6 7 8
//对3 取余 i%3
// 0 1 2 0 1 2 0 1 2
// 对3取整 i/3
// 0 0 0 1 1 1 2 2 2
// 考虑 间隔 ＋ 组合的个数
float x = xInterval + i%3*(xInterval + 50);
float y = yInterval + i/3*(yInterval + 50);
btn.frame = CGRectMake(x, y, 50, 50);
[btn setTitle:[NSString stringWithFormat:@"%d",i] forState:UIControlStateNormal];
btn.backgroundColor = [UIColor purpleColor];
[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
btn.tag = i;
[self.view addSubview:btn];
}
}
- (void)btnClick:(UIButton *)sender{
NSLog(@"点击了按钮%ld",sender.tag);
}
最终我们得到的九宫格视图如下
原理很简单吧~