Basics of Core Animation

What is Core Animation?


  • Framework for easily creating animated user interfaces.

  • Tightly integrated with UIKit.

  • Animate properties over time.

  • Layer based.

  • Done in background thread.

Core Animation Architecture




UIKit and Core Animation


Which should you use?
  • Almost always ....UIKit


Core Animation?
  • Lightweight
  • short-lived


Benefits of understanding Core Animation:
  • Improve app's effectiveness
  • Improve app's performance

Core Animation


The magic sauce:

  • Layers
  • Animatable properties
  • Declarative model

Layers



Layers


Layers

Creating a layer

  • QuartzCore framework


 #import<QuartzCore/QuartzCore.h>......
CALayer *myLayer=[CALayer layer];myLayer.frame=CGRectMake(0,0,width,height);myLayer.position=CGPointMake(30.0,67.0);myLayer.content=mylogo;[self.layer addSubLayer:myLayer];

what can i animate


  • Color
  • Motion
  • Opacity
  • Visibility
  • Filters
  • Content

animation types



  • Implicit Animation

  • Explicit Animation

implicit animation


  • Simplest type of animation
  • Simply change a layer property



//myLayer.position=nearBottomRight;
[CATransaction setAnimationDuration:5];myLayer.position=nearBottomRight;

explicit animation



Explicit Animation

Basic animations

  • Which property?

  •   Use KeyPath
  • @"position"
  • @"position.y"
  • ..........

  • Animation=[CABasicAnimation animationWithKeyPath:@"..."];

  • Add to layer
 [layer addAnimation:animation];

Explicit Animation


Let's drop the image

CABasicAnimation *move=[CABasicAnimation animationWithKeyPath:@"position.y"];     move.duration=3;    move.toValue=[NSNumber numberWithFloat:300];   [myLayer addAnimation:move forKey:@"moveimage"];   

Explicit Animation


Make it stick

    CGFloat yAtStart=myLayer.position.y;
    myLayer.position=CGPointMake(myLayer.position.x, 300);    CABasicAnimation *move=[CABasicAnimation animationWithKeyPath:@"position.y"];
    move.duration=3;
    move.fromValue=[NSNumber numberWithFloat:yAtStart];
    move.toValue=[NSNumber numberWithFloat:300];
    [myLayer addAnimation:move forKey:@"position"]; 

Want to learn more?






Thank You

Basics of Core Animation

By Torry Harris Business Solutions