1. 程式人生 > >核心動畫(關鍵幀動畫)-轉

核心動畫(關鍵幀動畫)-轉

一.簡單介紹 
是CAPropertyAnimation的子類,跟CABasicAnimation的區別是:CABasicAnimation只能從一個數值(fromValue)變到另一個數值(toValue),而CAKeyframeAnimation會使用一個NSArray儲存這些數值。 

屬性解析: 
values:就是上述的NSArray物件。裡面的元素稱為”關鍵幀”(keyframe)。動畫物件會在指定的時間(duration)內,依次顯示values陣列中的每一個關鍵幀。 
path:可以設定一個CGPathRef\CGMutablePathRef,讓層跟路徑移動。path只對CALayer的anchorPoint和position起作用。如果你設定了path,那麼values將被忽略 
keyTimes:可以為對應的關鍵幀指定對應的時間點,其取值範圍為0到1.0,keyTimes中的每一個時間值都對應values中的每一幀。當keyTimes沒有設定的時候,各個關鍵幀的時間是平分的。 

說明: 
CABasicAnimation可看做最多隻有2個關鍵幀的CAKeyframeAnimation。

 

二.程式碼示例 

第一種方式

@interface ViewController ()

@property(nonatomic,strong) UIView *customView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _customView = [[UIView alloc] initWithFrame:CGRectMake(0
, 100, 100, 100)]; _customView.backgroundColor = [UIColor yellowColor]; [self.view addSubview:_customView]; } - (void
)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ //建立核心動畫 CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animation]; //平移 keyAnimation.keyPath = @"position"; //告訴系統要執行什麼動畫 NSValue *value1 = [NSValue valueWithCGPoint:CGPointMake(100, 100)]; NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(200, 100)]; NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(200, 200)]; NSValue *value4 = [NSValue valueWithCGPoint:CGPointMake(100, 200)]; NSValue *value5 = [NSValue valueWithCGPoint:CGPointMake(100, 100)]; keyAnimation.values = @[value1,value2,value3,value4,value5]; //設定動畫完畢後,不刪除動畫 keyAnimation.removedOnCompletion = NO; //設定保持動畫的最新狀態 keyAnimation.fillMode = kCAFillModeForwards; //設定動畫執行的時間 keyAnimation.duration = 4.0; //設定動畫的節奏 keyAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; //設定代理,開始-結束 keyAnimation.delegate = self; //新增核心動畫 [_customView.layer addAnimation:keyAnimation forKey:nil]; } #pragma mark Core Animation Delegate - (void)animationDidStart:(CAAnimation *)anim{ NSLog(@"開始動畫"); } - (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{ NSLog(@"結束動畫"); } @end

第二種方式(使用path)讓layer在指定的路徑上移動

@interface ViewController ()

@property(nonatomic,strong) UIView *customView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _customView = [[UIView alloc] initWithFrame:CGRectMake(0,
                                                           100,
                                                           100,
                                                           100)];
    _customView.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:_customView];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    //建立核心動畫
    CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animation];
    keyAnimation.keyPath = @"position";
    //告訴系統要執行什麼動畫
    //建立一條路徑
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathAddEllipseInRect(path, NULL, CGRectMake(150, 100, 100, 100));
    keyAnimation.path = path;

    //有create就一定要有release
    CGPathRelease(path);

    //設定動畫執行完畢後,不刪除動畫
    keyAnimation.removedOnCompletion = NO;
    //設定儲存動畫的最新狀態
    keyAnimation.fillMode = kCAFillModeForwards;
    //設定動畫執行的時間
    keyAnimation.duration = 5.0;
    //設定動畫的節奏
    keyAnimation.timingFunction=[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

    //設定代理,開始-結束
    keyAnimation.delegate = self;
    //新增核心動畫
    [_customView.layer addAnimation:keyAnimation forKey:nil];
}

#pragma mark Core Animation Delegate
- (void)animationDidStart:(CAAnimation *)anim{
    NSLog(@"開始動畫");
}

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
    NSLog(@"結束動畫");
}

@end

說明:可以通過path屬性,讓layer在指定的路徑上運動。 
停止動畫:

//新增核心動畫
[self.customView.layer addAnimation:keyAnima forKey:@"wendingding"];
//停止self.customView.layer上名稱標示為wendingding的動畫
[self.customView.layer removeAnimationForKey:@"wendingding"];

三.圖示抖動

#import "ViewController.h"

#define angle2Radian(angle)  ((angle)/180.0*M_PI)

@interface ViewController ()

@property(nonatomic,strong) UIImageView *iconView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _iconView = [[UIImageView alloc] initWithFrame:CGRectMake(160,
                                                              150,
                                                              100,
                                                              100)];
    _iconView.image = [UIImage imageNamed:@"logo_100.jpg"];
    [self.view addSubview:_iconView];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    //建立核心動畫
    CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animation];
    keyAnimation.keyPath = @"transform.rotation";
    //設定動畫時間
    keyAnimation.duration = 0.1;
    //把度數轉換為弧度  度數/180*M_PI
    keyAnimation.values = @[@(-angle2Radian(4)),@(angle2Radian(4)),@(-angle2Radian(4))];
    //設定動畫的重複次數(設定為最大值)
    keyAnimation.repeatCount = MAXFLOAT;

    keyAnimation.fillMode = kCAFillModeForwards;
    keyAnimation.removedOnCompletion = NO;
    //新增動畫
    [self.iconView.layer addAnimation:keyAnimation
                               forKey:nil];
}
@end