iOS动画

iOS有很多动画技术，API主要分布在两个库中，一个是UIKit，另一个是CoreAnimation，先对UIKit动画做一下总结。

UIKit动画

在UIKit中，很多API都可以看到animated参数，表示是否动画显示，其实这是UIKit封装CoreAnimation后的结果。

比如大家肯定都写过模态视图和导航控制器，他们在视图展示的时候都会有一个animated参数。

[self.navigationController pushViewController:vc animated:YES];
[self PResentViewController:vc animated:YES completion:nil];

这些动画除了系统提供，其实我们是可以自己定制的，这里先简单提一下，下面在详细说。

主要API

UIKit主要API散落在UIView+UIViewAnimationWithBlocks和UIView+UIViewKeyframeAnimations两个分类

@interface UIView(UIViewAnimationWithBlocks)

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion 

+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion 

+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay usingSpringWithDamping:(CGFloat)dampingRatio initialSpringVelocity:(CGFloat)velocity options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion 

+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion

+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion

+ (void)performSystemAnimation:(UISystemAnimation)animation onViews:(NSArray *)views options:(UIViewAnimationOptions)options animations:(void (^)(void))parallelAnimations completion:(void (^)(BOOL finished))completion 

@end

@interface UIView (UIViewKeyframeAnimations)

+ (void)animateKeyframesWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewKeyframeAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion
+ (void)addKeyframeWithRelativeStartTime:(double)frameStartTime relativeDuration:(double)frameDuration animations:(void (^)(void))animations NS_AVAILABLE_IOS(7_0);

@end

我们每个API挨着看一下

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion 

这个是动画的一个常用API，用于创建常用的动画，参数列表如下

下面我们看一个动画例子：

    [UIView animateWithDuration:0.5 delay:1.0 options:UIViewAnimationOptionAutoreverse animations:^{
        CGRect frame = testView.frame;
        frame.origin.y += 100;
        testView.frame = frame;
    } completion:^(BOOL finished) {
        btn.hidden = YES;
    }];

这是在按钮click事件里面的一段代码，btn就是该按钮，testView定义如下

    testView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
    testView.backgroundColor = [UIColor blackColor];
    [self.view addSubview:testView];

大家运行代码会发现，1秒后动画开始，运行了0.5秒，视图先向下再向上运动100回到原点，然后突然跳到100的位置按钮消失。

回到原点的原因是我们options写了UIViewAnimationOptionAutoreverse动画选项，该项会在东环正向运行后自动翻转动画运行一遍。

大家应该能开出来options可以设置动画的一些行为

options大体上可以分为三类，分为动画属性，动画线性关系，和动画转场效果。

动画属性：

动画线性关系

动画转场效果

转场动画

转场动画的API如下，是为了控制视图的跳转而使用的

[UIView transitionWithView:subView duration:1.0 options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{
        [subView addSubview:testView];
} completion:^(BOOL finished) {
        
}];

运行这段代码可以看到视图被翻转过来的时候添加了testView在上面。

[UIView transitionFromView:subView toView:testView duration:1.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

这个方法可以控制一个控制器中的视图切换。

关键帧动画：

[UIView animateKeyframesWithDuration:2 delay:0 options:UIViewKeyframeAnimationOptionCalculationModeLinear animations:^{
        [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:0.25 animations:^{
            CGRect frame = testView.frame;
            frame.origin.y += 100 * flag;
            testView.frame = frame;
        }];
        [UIView addKeyframeWithRelativeStartTime:0.25 relativeDuration:0.25 animations:^{
            CGRect frame = testView.frame;
            frame.origin.y -= 100 * flag;
            testView.frame = frame;
        }];
        [UIView addKeyframeWithRelativeStartTime:0.5 relativeDuration:0.5 animations:^{
            CGRect frame = testView.frame;
            frame.origin.y += 200 * flag;
            testView.frame = frame;
        }];
    } completion:^(BOOL finished) {
        btn.hidden = YES;
    }];

可以看到，关键帧动画我们很方便的可以控制动画的整个过程，addKeyframeWithRelativeStartTime:是添加关键帧方法，参数startTime是一个在0~1之间的数字，表示开始时间占总时间的%多少，比如上例中的第一帧就是0，第二针就是25%也就是在0.5秒开始。relativeDuration和开始时间一样，是运行时间占整个时间的百分比。

弹簧动画

    [UIView animateWithDuration:0.5 delay:1.0 usingSpringWithDamping:1 initialSpringVelocity:0.1 options:UIViewAnimationOptionAutoreverse animations:^{
        CGRect frame = testView.frame;
        frame.origin.y += 100 * flag;
        testView.frame = frame;
    } completion:^(BOOL finished) {
        btn.hidden = YES;
    }];

弹簧动画的阻尼值，也就是相当于摩擦力的大小，该属性的值从0.0到1.0之间，越靠近0，阻尼越小，弹动的幅度越大，反之阻尼越大，弹动的幅度越小，如果大道一定程度，会出现弹不动的情况。

弹簧动画的速率，或者说是动力。值越小弹簧的动力越小，弹簧拉伸的幅度越小，反之动力越大，弹簧拉伸的幅度越大。这里需要注意的是，如果设置为0，表示忽略该属性，由动画持续时间和阻尼计算动画的效果。