五、CAAnimationGroup (组动画)

CAAnimationGroup (组动画),可以理解将CAAnimation、CABasicAnimation、CAKeyframeAnimation等定义好的单个动画加在一个组里面,

实现多个动画一起执行的效果,从而使得动画效果更炫。

比如说,一个view在移动的时候,又要让其旋转,这里有两个动画,怎么样让它一起执行呢,请看下面的代码:

//
//  ViewController.m
//  CAAnimation
//
//  Created by vincent_guo on 13-9-6.
//  Copyright (c) 2013年 vincent_guo. All rights reserved.
//

#import "ViewController.h"
#import <QuartzCore/QuartzCore.h>

@interface ViewController (){
    UIImageView *_imageView;
}
@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
    _imageView = [[UIImageView alloc] init];
    _imageView.bounds = CGRectMake(0, 0, 50, 50);
    _imageView.center = CGPointMake(160, 50);
    _imageView.image = [UIImage imageNamed:@"clock"];
    [self.view addSubview:_imageView];
    [_imageView release];
}

-(void)click:(id)sender{
    [self groupAnimationMetho];
}
#pragma mark 使用CAKeyframeAnimation让View向左转两圈,要向右转两圈,把-M_PI负号去掉就可以了
-(void)groupAnimationMetho{
    _imageView.center.y == 350 ? [self up] : [self drop];
}


#pragma mark 下落
-(void)drop{
    CFTimeInterval duration = 1.0;
    CAKeyframeAnimation *rotateAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotateAnimation.duration = duration;
    //先从原始位置向左转180度,再向左转180度是-M_PI*4,不是-M_PI*2哦,自己好好理解下)
    rotateAnimation.values = [NSArray arrayWithObjects:
                              [NSNumber numberWithFloat:0.0f],
                              [NSNumber numberWithFloat:0.0f],
                              [NSNumber numberWithFloat:-M_PI * 2],
                              [NSNumber numberWithFloat:-M_PI * 4], nil];
    
    //keyTimes里的每一个值对应valuse的每一个值,意思是动画哪个时候开始执行.比如动画时间是1秒,当1*0.7秒的时候开始招待-M_PI*2的动画
    rotateAnimation.keyTimes = [NSArray arrayWithObjects:
                                [NSNumber numberWithFloat:0],
                                [NSNumber numberWithFloat:.6],
                                [NSNumber numberWithFloat:.7],
                                [NSNumber numberWithFloat:.8], nil];
    
    //position 代表位置属性,如中心点(x,y)的值
    CAKeyframeAnimation *positionAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    positionAnimation.duration = duration;
    //定义个position(位置变换的路径)
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, NULL, 160, 50);
    CGPathAddLineToPoint(path, NULL, 160, 100);
    CGPathAddLineToPoint(path, NULL, 160, 150);
    CGPathAddLineToPoint(path, NULL, 160, 200);
    CGPathAddLineToPoint(path, NULL, 160, 350);
    CGPathAddLineToPoint(path, NULL, 160, 335);//为什么移动的y值又小了,是因为想让它实现反弹的效果
    CGPathAddLineToPoint(path, NULL, 160, 350);
    positionAnimation.path = path;
    CGPathRelease(path);
    
    
    CAAnimationGroup *groupAnimation = [CAAnimationGroup animation];
    groupAnimation.duration = duration;
    groupAnimation.fillMode = kCAFillModeForwards;
    //        *  动画的开始与结束的快慢,有五个预置分别为(下同):
    //        *  kCAMediaTimingFunctionLinear            线性,即匀速
    //        *  kCAMediaTimingFunctionEaseIn            先慢后快
    //        *  kCAMediaTimingFunctionEaseOut           先快后慢
    //        *  kCAMediaTimingFunctionEaseInEaseOut     先慢后快再慢
    //        *  kCAMediaTimingFunctionDefault           实际效果是动画中间比较快.
    groupAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    
    //将移动和旋转动画加在一起
    groupAnimation.animations = [NSArray arrayWithObjects:positionAnimation, rotateAnimation,nil];
    [_imageView.layer addAnimation:groupAnimation forKey:@"drop"];
    _imageView.center = (CGPoint){160, 350};
}


#pragma mark 上升
-(void)up{
        CFTimeInterval duration = 0.5;
        CAKeyframeAnimation *rotateAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
        rotateAnimation.duration = duration;
        rotateAnimation.values = [NSArray arrayWithObjects:
                                  [NSNumber numberWithFloat:0.0f],
                                  [NSNumber numberWithFloat:M_PI * 2],
                                  [NSNumber numberWithFloat:M_PI * 4], nil];
        
        rotateAnimation.keyTimes = [NSArray arrayWithObjects:
                                    [NSNumber numberWithFloat:0],
                                    [NSNumber numberWithFloat:.1],
                                    [NSNumber numberWithFloat:.2],nil];
        
        //position 代表位置属性,如中心点(x,y)的值
        CAKeyframeAnimation *positionAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
        positionAnimation.duration = duration;
        //定义个position(位置变换的路径)
        CGMutablePathRef path = CGPathCreateMutable();
        CGPathMoveToPoint(path, NULL, 160, 350);
        CGPathAddLineToPoint(path, NULL, 160, 300);
        CGPathAddLineToPoint(path, NULL, 160, 200);
        CGPathAddLineToPoint(path, NULL, 160, 150);
        CGPathAddLineToPoint(path, NULL, 160, 50);
        CGPathAddLineToPoint(path, NULL, 160, 30);
        CGPathAddLineToPoint(path, NULL, 160, 50);
        positionAnimation.path = path;
        CGPathRelease(path);
        
        
        CAAnimationGroup *groupAnimation = [CAAnimationGroup animation];
        groupAnimation.duration = duration;
        groupAnimation.fillMode = kCAFillModeForwards;
        groupAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
        groupAnimation.animations = [NSArray arrayWithObjects:positionAnimation, rotateAnimation,nil];
        [_imageView.layer addAnimation:groupAnimation forKey:@"up"];
        _imageView.center = (CGPoint){160, 50};
}
@end

  

 

源代码可以下载来运行看下效果:点击下载CAAnimationGroupDemo

posted @ 2013-09-06 15:54  Vincent_Guo  阅读(622)  评论(0编辑  收藏  举报