グラデーションをアニメーションさせよう。

以前、 UIViewの背景にグラデーションを設定しましたが、今回はそのグラデーションをアニメーションさせてみます。

// アニメーションの原点を中心にする
layer.anchorPoint = CGPointMake(.5, .5);

// CABasicAnimationを作成
CABasicAnimation *animation   = [CABasicAnimation animationWithKeyPath:@"colors"];

// アニメーションにかける時間を設定（12秒）
animation.duration       = 12.0;

// アニメーションの繰り返し回数を設定（無限）
animation.repeatCount    = HUGE_VALF;

// アニメーションが終わった際に逆回しを設定
animation.autoreverses   = YES;

// イージングを調整
animation.timingFunction = [CAMediaTimingFunction functionWithName: kCAMediaTimingFunctionEaseInEaseOut];

// アニメーション開始時のグラデーション
animation.fromValue        = @[
                               (id)[UIColor colorWithRed:.87
                                                   green:.68
                                                    blue:.27
                                                   alpha:.9
                                    ].CGColor,
                               (id)[UIColor colorWithRed:.89
                                                   green:.54
                                                    blue:.72
                                                   alpha:.9
                                    ].CGColor,
                               ];

// アニメーション終了時のグラデーション
animation.toValue      = @[
                             (id)[UIColor colorWithRed:.33
                                                 green:.79
                                                  blue:.76
                                                 alpha:.9
                                  ].CGColor,
                             (id)[UIColor colorWithRed:.69
                                                 green:.87
                                                  blue:.65
                                                 alpha:.9
                                  ].CGColor,
                             ];

// レイヤーにアニメーションを追加
[layer addAnimation:animation forKey:@"colors"];

とこんな感じでグラデーションがアニメーションするようになりました。

みかづきブログその3

本ブログは更新を終了しました。通算140万ユーザーの方に観覧頂くことができました。長い間、ありがとうございました。

グラデーションをアニメーションさせよう。