Hatena::Groupxn--272ax3f

iOSアプリ開発勉強会#10

iOSアプリ開発勉強会#10

Core Animation レイヤ

重要なクラス

レイヤとビュー

  • ビューは描画方法を知らない
  • 対応するCALayerが描画方法を知っている (暗黙的レイヤ)
  • ビューに対応した親子関係がレイヤにもある
    • 親が描画されたあと子も描画される

CALayerの生成

CALayer *layer = [[CALayer alloc] init];
[layer setBounds:CGRectMake(0,0,85,85)];
[layer setPosition:CGPointMake(160,100)];

//背景色を設定する
[layer setBackgroundColor: [[UIClor redColor] CGColor]];

//画像を設定する
[layer setContents: (id) ( [[UIImage imageNamed:@"Hypno.png"] CGImage] )];
[layer setContentsRect:CGRectMake(-0.1, -0.1, 1.2, 1.2)];
[layer setContentsGravity:kCAGravityResizeAspect];

暗黙的にアニメーション化可能なプロパティ

- (void)touchesBegin: (NSSet *)touches withEvent:(UIEvent *)event {
  UITouch *t = [touches anyObject];
  CGPoint p = [t locationInView:self];
  [boxLayer setPosition];
}
- (void)touchesMove: (NSSet *)touches withEvent:(UIEvent *)event {
  UITouch *t = [touches anyObject];
  CGPoint p = [t locationInView:self];
  [boxLayer setPosition];
}
  • CATransactionでとめる
- (void)touchesMove: (NSSet *)touches withEvent:(UIEvent *)event {
  UITouch *t = [touches anyObject];
  CGPoint p = [t locationInView:self];
  [CATransaction begin];
  [CATransaction setDisableActions:YES];
  [boxLayer setPosition];
  [CATransaction commit];
}

その他

CAAnimation を使ったアニメーションの制御

アニメーションオブジェクト

  • CAAnimation
    • タイミングを取り仕切る
    • 抽象クラスなので実際にはサブクラスを使う
  • CAAnimation
    • CAAnimationGroup
    • CAPropertyAnimation => プロパティを変化させるときはこれ
      • CABasicAnimation
      • CAKeyframeAnimation
    • CATransition
  • CABasicAnimation
CABasicAnimation *fader = [CABasicAnimation animationWithKeyPath:@"opacity"];
[fader setDuration: 2.0];
[fader setFromValue: [NSNumber numberWithFloat:1.0]];
[fader setToValue: [NSNumber numberWithFloat:0.0]];
[layer addAnimation:fader forKey:@"BigFade"];
  • CAKeyframeAnimation
    • 値の変化を複数セットできる
      • 1.0 => 0.8
      • 0.8 => 0.1
CAAnimationGroup *group = [CAAnimationGroup animation];
[group setAnimations: [NSArray arrayWithObjects: anime1, anime2, nil]];

CABasicAnimationを使った回転

  • HypoTimeのプロジェクトの日付の部分を回転させる

タイミング関数

  • 何も指定しないと線形にアニメーションする
  • EaseIn,EaseOutとかできる
  • 自作もできる
CAMediaTimingFunction *tf = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[anime setTimingFunction: tf];

アニメーションの完了

  • デリゲート (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag を実装しよう

CAKeyframeAnimationを使って弾ませる

その他