IOS动画简介

(文章内容摘自苹果官方文档，略有修改)

IOS 支持各种不同的动画效果，使得界面的调整，变换过渡得很优美。然后这些各色的动画效果却不需要开发者写任务绘制代码就可以实现。你需要的，仅仅是去触发动画而已。

 

哪些内容可以做到动画效果？

UIKit 和 Core Animation 都支持动画。 但两者的技术实现层面不通。

 

1、UIKit

UIKit，动画效果依赖与UIView对象。View支持一整套基本的动画，基本上可以实现各种常用的动画效果

 

下面列表是UIView中一些支持动画效果的属性。

要实现这些属性的动画效果，只需要把修改属性的代码放在 动画block中 去执行(见动画效果修改属性)

 

属性

效果

frame

改变该属性会更改view的大小和相对于父view的坐标值

bounds

改变该属性会更改view的大小

center

改变该属性会更改view在其父view的坐标值

transform

该属性支持缩放,旋转(仅限于2D, 3D变换需要用到Core Animation)

alpha

支持修改透明度

backgroundColor

修改view的背景色

ContentStretch

设置伸展view，自动填充空余空间

 

 

动画效果修改属性

1.1 使用Block 方法

如果是IOS4 或之后的系统，可使用block方式初始动画效果。

 UIView中有几个动画方法:

 

•  animateWithDuration:animations:

•  animateWithDuration:animations:completion:

•  animateWithDuration:delay:options:animations:completion:

这些都是类方法(class methods),因此用这些方法实现的效果不会仅限于一个view对象。1-1 简单的动画

 

[UIView animateWithDuration:1.0 animations:^{

        firstView.alpha = 0.0;

        secondView.alpha = 1.0;

}];

 

这个例子仅使用 ease-in, ease-out animation curve 效果。如果需要更多设置，请使用 animateWithDuration:delay:options:animations:completion: 方法，该方法支持设置更多的参数。

另，上述方法还支持completion block，在动画执行结束时调用。 一般completion block会被用来连接下一个动画。

下面例子就是在第一个动画结束后，在completion block中设置了一个 fade-out 淡出效果。

1-2

- (IBAction)showHideView:(id)sender

{

    // Fade out the view right away

    [UIView animateWithDuration:1.0

        delay: 0.0

        options: UIViewAnimationOptionCurveEaseIn

        animations:^{

             thirdView.alpha = 0.0;

        }

        completion:^(BOOL finished){

            // Wait one second and then fade in the view

            [UIView animateWithDuration:1.0

                 delay: 1.0

                 options:UIViewAnimationOptionCurveEaseOut

                 animations:^{

                    thirdView.alpha = 1.0;

                 }

                 completion:nil];

        }];

}

 

 

1.2 使用Begin/Commit 方法

如果是在IOS3.2 或 更早的版本中使用，需要调用 UIView 的 beginAnimations:context: and commitAnimations 这两个类方法 来实现动画效果。

Begin/Commit 方式 与 上述的 block 方式支持同样的功能。 但如果你是4.0以后的版本，苹果还是建议使用block方式。

 

例子 2-1 实现了与 1-1 同样的效果。

2-1  使用begin/commit 实现简单动画

    [UIView beginAnimations:@"ToggleViews" context:nil];

    [UIView setAnimationDuration:1.0];

 

    // Make the animatable changes.

    firstView.alpha = 0.0;

    secondView.alpha = 1.0;

 

    // Commit the changes and perform the animation.

    [UIView commitAnimations];

 

默认情况下，animation区中的所有属性修改都会触发动画效果。 如果你仅希望部分属性修改时有动画效果，可使用 setAnimationsEnabled 方法 先临时停用动画效果，直到到了你希望继续使用动画效果的代码是，再调用 setAnimationsEnabled 方法 启动动画效果即可。

另，areAnimationsEnabled class method. 可用于判断当前是否有开启动画效果。

 

在Begin/Commit 动画效果中设置参数

2-2 实现了与1-2 相同的效果

先淡出，1秒后，再淡入。

为实现此效果，需要设置代理 delegate

2-2  在 begin/commit 中使用参数

// This method begins the first animation.

- (IBAction)showHideView:(id)sender

{

    [UIView beginAnimations:@"ShowHideView" context:nil];

    [UIView setAnimationCurve:UIViewAnimationCurveEaseIn];

    [UIView setAnimationDuration:1.0];

    [UIView setAnimationDelegate:self];

    [UIView setAnimationDidStopSelector:@selector(showHideDidStop:finished:context:)];

 

    // Make the animatable changes.

    thirdView.alpha = 0.0;

 

    // Commit the changes and perform the animation.

    [UIView commitAnimations];

}

 

// Called at the end of the preceding animation.

- (void)showHideDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context

{

    [UIView beginAnimations:@"ShowHideView2" context:nil];

    [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];

    [UIView setAnimationDuration:1.0];

    [UIView setAnimationDelay:1.0];

 

    thirdView.alpha = 1.0;

 

    [UIView commitAnimations];

}

 

1.3 Block的内嵌使用

3-1  内嵌不同参数配置的动画

[UIView animateWithDuration:1.0

        delay: 1.0

        options:UIViewAnimationOptionCurveEaseOut

        animations:^{

            aView.alpha = 0.0;

 

            // Create a nested animation that has a different

            // duration, timing curve, and configuration.

            [UIView animateWithDuration:0.2

                 delay:0.0

                 options: UIViewAnimationOptionOverrideInheritedCurve |

                          UIViewAnimationOptionCurveLinear |

                          UIViewAnimationOptionOverrideInheritedDuration |

                          UIViewAnimationOptionRepeat |

                          UIViewAnimationOptionAutoreverse

                 animations:^{

                      [UIView setAnimationRepeatCount:2.5];

                      anotherView.alpha = 0.0;

                 }

                 completion:nil];

 

        }

        completion:nil];

 

 

2. 使用Core Animation

 

如果你需要实现更为复杂的动画效果，或者是UIView不支持的动画效果，你可以考虑使用Core Animation 和 view的 优先层(underlying layer) 来实现动画效果。事实上，view 和 层是联系在一起的。对于一个层的修改最终也会响应到层所属的view之上。

使用Core Animation，可以实现层的如下效果

 

•  层的大小和位置

•  做外形变换时的中心点位置

•  支持层的3D变换

•  增加/移除层

•  Z坐标位置调整

•  层阴影

•  层边框 (包括圆角边框)

•  修改大小时，层中容许延展的部分

•  层透明度

•  子层的剪切效果

•  层内容

•  光栅效果

有关Core Animation 更详尽的用法，参考 Core Animation Programming Guide 和 Core Animation Cookbook

http://developer.apple.com/library/ios/#documentation/Cocoa/Conceptual/CoreAnimation_guide/Introduction/Introduction.html#//apple_ref/doc/uid/TP40004514

 

http://developer.apple.com/library/ios/#documentation/GraphicsImaging/Conceptual/CoreAnimation_Cookbook/Introduction/Introduction.html#//apple_ref/doc/uid/TP40005406