This document discusses CoreAnimation, a Mac and iOS framework for animating layers and views. It provides an overview of key CoreAnimation classes like CALayer, which is used to render content for views, and CAAnimation for animating layer properties. It also covers topics like using CATransaction to group animations, animating layer properties with CABasicAnimation and CAKeyframeAnimation, and controlling animation timing with properties like beginTime.

1. CoreAnimation
Weizhong Yang
a.k.a zonble
zonble@gmail.com
http://zonble.net

2. https://github.com/zonble/CAShowcase
New BSD License

3. Why CoreAnimation?
• iPad
• UIView
OpenGL
CoreAnimation

4. CoreAnimation
• Mac/iOS framework
•
• UIView CoreAnimation
wrapper

5. CoreAnimation
• concurrent
•
…

6. CoreAnimation
•
• Mockup
…
• …

7. CoreAnimation
• Objective-C
•

8. Class
• CALayer
• CAAnimation
• CATransaction

9. • #import <QuartzCore/QuartzCore.h>

10. CALayer

11. CALayer
• iOS
• UIView layer [aView
layer] or aView.layer
• Mac
• NSView setWantsLayer:
• iOS

12. CALayer Interface
• frame bounds background color
• layer layer
addSublayer
• superlayer

13. CALayer View
• responder
event Click Touch…
• property
•

14. CALayer
• CALayer *aLayer = [CALayer layer];
• aLayer.contents = (id)[UIImage
imageNamed:@”test.jpg”].CGImage;
• fade in/
out

15. CALayer
• aLayer.position = CGPointMake()...
• aLayer.bounds = CGRectMake()...
•
• 0.25

16. • Layer property
• CAAnimation
• …

17. CATransaction 1
[CATransaction begin];
[CATransaction setValue:(id)kCFBooleanTrue
forKey:kCATransactionDisableActions];
// CALayer
[CATransaction commit];
//

18. CATransaction 2
[CATransaction begin];
[CATransaction setValue:[NSNumber
numberWithFloat:2.0] forKey:
kCATransactionAnimationDuration];
// CALayer
[CATransaction commit];

19. CATransition…
CATransition *t = [CATransition animation];
t.type = kCATransitionMoveIn
t.subtype = kCATransitionFromRight;
aLayer.contents = (id)[UIImage
imageNamed:@”test.jpg”].CGImage;
[aLayer addAnimation:t forKey:@"Transition"];
//

20. CATransition
• Private API flip cube
• reject …

21. CAAnimation

22. CAAnimation
• CABasicAnimation
• CAKeyframeAnimation
• CAAnimationGroup
• CATransition …

23. CABasicAnimation
• [CABasicAnimation
animationWithKeyPath:...]
• @”position”
• @”bounds”
• @”opacity”
• @”contents”...

24. CABasicAnimation
•
• @”transform.rotation.x”
• @”transform.rotation.y”
• @”transform.rotation.z”
• ...

25. CABasicAnimation
• fromValue = [NSValue...];
• toValue = [NSValue ...];
• duration = 3.0; //Seconds
• repeatCount = NSUIntegerMax; // Forever

26. CAKeyframeAnimation
• fromValue toValue
CGPathRef
• CAKeyframeAnimation *a
=[CAKeyframeAnimation
animationWithKeyPath:@"position"];
• a.path = (CGPathRef)path;

27. CAAnimationGroup
• CAAnimationGroup *group =
[CAAnimationGroup animation];
• group.animations = [NSArray
arrayWithObjects:anim1, anim2, nil];

28. CAAnimation
• [aLayer addAnimation:myAnimation
forKey:@"MyKey"];

29. fill mode
• layer
• animation.fillMode =
kCAFillModeForwards;
• …

30. CABasicAnimation *a = [CABasicAnimation
animationWithKeyPath:@”bounds”];
a.fromValue = [NSValue valuwWithCGRect:fromRect];
a.toValue = [NSValue valuwWithCGRect:toRect];
[aLayer addAnimation:a forKey:@"boundsAnimation"];
NSLog(@”bounds:%@”, NSStringFromCGRect(aLayer.bounds));
• bounds toValue
• layer layer property

31. Layer

32. • [aLayer addAnimation:myAnimation1
forKey:@"MyKey1"];
• [aLayer addAnimation:myAnimation2
forKey:@"MyKey2"];
•

33. • [self
perforeSelector:@selector(runAnimation1)
withObject:nil afterDelay:1.0]; //
• [self
perforeSelector:@selector(runAnimation2)
withObject:nil afterDelay:2.0]; //
•

34. beginTime
• animation1.beginTime =
CACurrentMediaTime() + 1.0; //
• animation2.beginTime =
CACurrentMediaTime() + 2.0; //
• CAAnimation
…

35. animation
• layer view
•
layer UIView layer
view.layer
• app

36. animation.delegate = self;
[myLayer addAnimation: animation forKey:@”key”];
...
- (void)animationDidStop:(CAAnimation
*)theAnimation finished:(BOOL)flag {
// Fire another animation
}
//

37. delegate
animation.delegate = self;
animation.removedOnCompletion = NO;
[myLayer addAnimation: animation forKey:@”key”];
...
- (void)animationDidStop:(CAAnimation *)theAnimation finished:(BOOL)flag {
if (theAnimation == [myLayer animationForKey:@”key”]) {
// Fire another animation
[myLayer removeAllAnimations];
}
}
//

38. λ λ
• CAAnimation
block …
• iOS 5
• Lion

40. CALayer
• UILayer -layoutSublayers
• UIView -layoutSubviews
…

41. contents
CALayer Quartz
- (void)drawInContext:(CGContextRef)ctx
{
UIGraphicsPushContext(ctx);
// ctx current graphics context :D
UIBezierPath *path = [UIBezierPath
bezierPathWithRoundedRect:self.bounds cornerRadius:10.0];
CGContextSaveGState(ctx);
CGContextAddPath(ctx, path.CGPath);
CGContextClip(ctx);
[image drawInRect:self.bounds];
CGContextRestoreGState(ctx);
UIGraphicsPopContext();
}

42. view layer
view
UIGraphicsBeginImageContext(self.bounds.size);
CGContextRef ctx = UIGraphicsGetCurrentContext();
[self.layer renderInContext:ctx];
UIImage *anImage =
UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return anImage;
// :D

44. Mac
Cocoa Drawing NSView
CALayer …

45. Accessibility
• app
• …
• UIView/UIControl
Accessibility CALayer
Accessibility

46. Das ist alles.