iOS动画实现总结

在iOS中，动画实现方向有两种，一种是操作UIView的animation方法，另外一种就是核心动画，但到iOS7中，UIView又跟核心动画牵扯在一起。

方式一（利用核心动画添加动画）

• 核心动画的层次关系

•  

• 转场动画(CATransition)

  • 用于做场景的转换动画，能偶为层提供移出屏幕和一如屏幕的动画效果。
  • UINavigationController就是通过CATransition实现了讲控制器的师徒推入屏幕的动画效果。
  • 常用属性
    • type动画过度类型
    • subtype:动画过度方向
    • startProgress:动画起点(在整体的百分比)(可用的值从0到1，在动画中起点或终点的逗留时间，开始的时间一定要比结束的时间小，下同)
    • endProgress:动画终点(在整体动画的百分比)

   CATransition *animation = [CATransition animation];
    animation.type = @"reveal";
    animation.duration = 1;
    animation.subtype = kCATransitionReveal;
    [self.myView.layer addAnimation:animation forKey:nil];
    CGPoint point = self.myView.center;
    point.y += 150;
    [self.myView setCenter:point];

 

• 基本动画(CABasicAnimation),是CAPropertyAnimation的子类,一个动画可控制一个属性的变化，变化值只能是两个值中变化，可以在fromValue和toValue两个值中设置

  CABasicAnimation *baseAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"];
    baseAnimation.fromValue = [NSValue valueWithCGRect:CGRectMake(20, 20, 100, 100)];
    baseAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(100, 100, 200, 200)];
  
    baseAnimation.duration = 2.0;
    baseAnimation.removedOnCompletion = NO;
    baseAnimation.fillMode = kCAFillModeForwards;
    baseAnimation.repeatCount = MAXFLOAT;
  
    [self.myView.layer addAnimation:baseAnimation forKey:nil];

   

• 帧动画(CAKeyframeAnimation)，帧动画也是CAPropertyAnimation的子类，所以也是控制一个view的属性做动画，与CABaseAnimation不同的是，CAKeyFrameAnimation可以添加多个关键帧，而CABaseAnimation可以看做是两个关键帧的帧动画，我们可以好好利用帧动画的关键帧来做比较有趣的动画，如泡泡效果。

   CAAnimationGroup *group = [[CAAnimationGroup alloc] init];
//    位移
    CAKeyframeAnimation *positionAnima = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    positionAnima.calculationMode = kCAAnimationCubicPaced;
    positionAnima.duration = 5;
    positionAnima.fillMode = kCAFillModeForwards;
    positionAnima.removedOnCompletion = NO;
    positionAnima.repeatCount = MAXFLOAT;
    positionAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];

//    添加移动路径
    CGMutablePathRef curvedPath = CGPathCreateMutable();
    CGRect circleContainer = CGRectInset(myView.frame, myView.frame.size.width / 2 - 3, myView.frame.size.height / 2 - 3);
    CGPathAddEllipseInRect(curvedPath, NULL, circleContainer);
    positionAnima.path = curvedPath;
    CGPathRelease(curvedPath);
    [myView.layer addAnimation:positionAnima forKey:nil];

//    缩放X
    CAKeyframeAnimation *scaleX = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.x"];
    scaleX.duration = 1.0;
    scaleX.values = @[@1.0,@1.1,@1.0];
    scaleX.keyTimes = @[@0.0,@0.5,@1.0];
    scaleX.repeatCount = MAXFLOAT;
    scaleX.autoreverses = YES;

    scaleX.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [myView.layer addAnimation:scaleX forKey:nil];

//    缩放Y
    CAKeyframeAnimation *scaleY = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale.y"];
    scaleY.duration = 1.5;
    scaleY.values = @[@1.0,@1.1,@1.0];
    scaleY.keyTimes = @[@0.0,@0.5,@1.0];
    scaleY.repeatCount = MAXFLOAT;
    scaleY.autoreverses = YES;

    group.animations = @[positionAnima,scaleX,scaleY];
    scaleY.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [myView.layer addAnimation:scaleY forKey:nil];

运行效果

由于本人的电脑是黑苹果，所以将就一下啦，哈哈，白苹果应该不会这样的。

• 动画组(CAAnimationGroup)CAAnimation的子类，可以保存一组动画对象，讲CAAnimationGroup对象加入层后，组中所有动画可以同时运行，所以，当我们需要做多个动画并且执行的时间不一样的时候，动画组就不适用。例如上面的泡泡效果。

group.animations = [里面放动画对象];

 

方式二（利用UIView添加动画）

• UIView动画(手码)
  • 添加单个动画

    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:4];
    CGPoint point = self.myView.center;
    point.y += 150;
    [self.myView setCenter:point];
    [UIView commitAnimations];

     

  • 添加多个动画

　　[UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:4];
    CGPoint point = self.myView.center;
    point.y += 150;
    [self.myView setCenter:point];
    [UIView commitAnimations];

    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:4];
    [self.myView setAlpha:0.1];
    [UIView commitAnimations];

 

• UIView动画(Block)

[UIView animateWithDuration:4 animations:^{
        CGPoint point = self.myView.center;
        point.y += 150;
        [self.myView setCenter:point];
    }];

 

• UIView动画(Block帧动画),从iOS7开启，苹果提供了比较便捷的方法来调用帧动画，不用新建帧动画实例，直接对layer的属性进行控制。

[UIView animateKeyframesWithDuration:0.5 delay:1 options:UIViewKeyframeAnimationOptionAutoreverse animations:^{
        self.view.bounds = CGRectMake(30, 30, 30, 30);
    } completion:^(BOOL finished) {

    }];

• UIView转场动画。

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

 

这个方法应该不好理解，简单来说，这个方法调用完毕后，相当于执行了两句代码，

// 添加toView到父视图
[fromView.superview addSubview:toView];
// 把fromView从父视图中移除
[fromView.superview removeFromSuperview];
- duration：动画的持续时间
- duration：动画的持续时间
- options：转场动画的类型
- animations：将改变视图属性的代码放在这个block中
- completion：动画结束后，会自动调用这个block