Core Animationを理解する -KeyframeAnimation-

objective-C

基本アニメーションに似ていますが、対象値の配列を指定することができます。

たとえば。。。
・ボールが地面に落ちてからバウンドしていくさま
・ゆったりしてから徐々に加速するページ遷移


つまり、指定する座標までははやかったり、遅くしたりするといった挙動が可能になる

ここではViewClassとViewControllerクラスを使ってボールが上から下にジグザグに
落ちていくアニメーションを作成する

手順としては

・viewClassを作成
・init時にキーフレームの値を設定
・viewControllerにて呼び出す

viewClassを作成

インスタンス変数としてPathを設定

KeyframeAnimationView.h
#import <QuartzCore/QuartzCore.h>
#import "BasicAnimationLayer.h"

@interface KeyframeAnimationView : UIView
{
    BasicAnimationLayer *spot;
    CGMutablePathRef path;
}
@end

init時にキーフレームの値を設定

KeyframeAnimationView.m
- (void)_init
{
    self.backgroundColor = [UIColor whiteColor];
    path = CGPathCreateMutable();
      
    // アイコンの初回位置
    CGPathMoveToPoint(path, NULL, 74.0, 74.0);

    // 一回目の移動で座標(x,y)=(320.0, 500.0)まで弧を描いて移動する
    CGPathAddCurveToPoint(path, NULL, 74.0, 500.0, 320.0, 500.0, 320.0, 500.0);
    // 二回目の移動で座標(x,y)=(566.0, 74.0)まで弧を描いて移動する
    CGPathAddCurveToPoint(path, NULL, 320.0, 500.0, 566.0, 500.0, 566.0, 74.0);
    
    // 動き回るアイコンの設定
	spot = [[BasicAnimationLayer alloc] init];
	spot.bounds = CGRectMake(0.0, 0.0, 100.0, 100.0);
	[self.layer addSublayer:spot];
	
    // positionプロパティをキーパスに指定して、アニメーションのオブジェクトを作成する
	CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    // 再生時間を5.0秒に設定
	animation.duration = 5.0;
	animation.path = path;
	animation.repeatCount = NSUIntegerMax;
	animation.autoreverses = YES;
	animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
	[spot addAnimation:animation forKey:@"move"];

}

viewControllerにて呼び出す

KeyframeAnimationViewController.m
-(void)loadView
{
    KeyframeAnimationView *pathView = [[KeyframeAnimationView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    pathView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    self.view = [pathView autorelease];
}