Core Animation. Building Animated UI s. Bill Dudney. Gala Factory Software LLC. Bill Dudney Core Animation: Building Animated UI s Slide 1

Transcription

1 Core Animation Building Animated UI s Bill Dudney Gala Factory Software LLC Bill Dudney Core Animation: Building Animated UI s Slide 1

2 Objective-C Dynamic Object Oriented C Based Smalltalk Roots Bill Dudney Core Animation: Building Animated UI s Slide 2

3 Objective-C 2 Files: Header & Customer : NSObject Bill Dudney Core Animation: Building Animated UI s Slide 3

4 Objective-C Methods - Customer : NSObject { } + (NSArray *)allcustomers; - (Money Bill Dudney Core Animation: Building Animated UI s Slide 4

5 Objective-C Methods - Customer + (NSArray *)allcustomers { } - (Money *)averagemonthlyspending { Bill Dudney Core Animation: Building Animated UI s Slide 5

6 Objective-C Properties - Customer : NSObject { NSString *firstname; retain) NSString Bill Dudney Core Animation: Building Animated UI s Slide 6

7 Objective-C Properties - Bill Dudney Core Animation: Building Animated UI s Slide 7

8 Tools Xcode Interface Builder Live Code Bill Dudney Core Animation: Building Animated UI s Slide 8

9 Layer Bill Dudney Core Animation: Building Animated UI s Slide 9

10 Layer Bill Dudney Core Animation: Building Animated UI s Slide 10

11 Layer Bill Dudney Core Animation: Building Animated UI s Slide 11

12 Layer Bill Dudney Core Animation: Building Animated UI s Slide 12

13 Layer Bill Dudney Core Animation: Building Animated UI s Slide 13

14 Layer Bill Dudney Core Animation: Building Animated UI s Slide 14

15 Layer Bill Dudney Core Animation: Building Animated UI s Slide 15

16 Layer Bill Dudney Core Animation: Building Animated UI s Slide 16

17 Layer Bill Dudney Core Animation: Building Animated UI s Slide 17

18 Layer CALayer root CALayer menu CALayer next button CALayer previous button CATextLayer Option 1 CATextLayer Option 2 CATextLayer Option 3 Bill Dudney Core Animation: Building Animated UI s Slide 18

19 Layers & Events Live Code Bill Dudney Core Animation: Building Animated UI s Slide 19

20 Animation Delegation Actions Style Default Bill Dudney Core Animation: Building Animated UI s Slide 20

21 Finding an Animation CALayer actionforlayer:forkey: delegate action Bill Dudney Core Animation: Building Animated UI s Slide 21

22 Finding an Animation CALayer valueforkey: actions action Bill Dudney Core Animation: Building Animated UI s Slide 22

23 Finding an Animation actions CALayer valueforkeypath: style action Bill Dudney Core Animation: Building Animated UI s Slide 23

24 Default Animation CALayer defaultactionforkey: CALayer class action Bill Dudney Core Animation: Building Animated UI s Slide 24

25 Animation Delegate - (id<caaction>)actionforlayer:(calayer *)layer forkey:(nsstring *)key { id<caaction> action = nil; if([key isequaltostring:@"opacity"]) { CABasicAnimation *animation = [CABasicAnimation animationwithkeypath:@"opacity"]; animation.duration = 0.5f; action = animation; } else if([key isequaltostring:@"sublayers"]) { action = (id<caaction>)[nsnull null]; } return action; } Bill Dudney Core Animation: Building Animated UI s Slide 25

26 Animations - actions - (void)setupanimations:(calayer *)layer { CABasicAnimation *animation = [CABasicAnimation animation]; animation.duration = 0.5f; layer.actions = [NSDictionary dictionarywithobject:animation forkey:@"opacity"]; } Bill Dudney Core Animation: Building Animated UI s Slide 26

27 Animations - style - (void)setupanimations:(calayer *)layer { CABasicAnimation *animation = [CABasicAnimation animation]; animation.duration = 0.5f; id animations = [NSDictionary dictionarywithobject:animation forkey:@"opacity"]; layer.style = [NSDictionary dictionarywithobject:animations forkey:@"actions"]; } Bill Dudney Core Animation: Building Animated UI s Slide 27

28 Animations - default + (id <CAAction>)defaultActionForKey:(NSString *)key; Live Code Bill Dudney Core Animation: Building Animated UI s Slide 28

29 Animation Types Basic Keyframe Transitions Bill Dudney Core Animation: Building Animated UI s Slide 29

30 Animation - Basic Bill Dudney Core Animation: Building Animated UI s Slide 30

31 Animation - Basic Bill Dudney Core Animation: Building Animated UI s Slide 31

32 Animation - Keyframe Bill Dudney Core Animation: Building Animated UI s Slide 32

33 Animation - Keyframe Bill Dudney Core Animation: Building Animated UI s Slide 33

34 Animation - Keyframe Bill Dudney Core Animation: Building Animated UI s Slide 34

35 Animation - Keyframe Bill Dudney Core Animation: Building Animated UI s Slide 35

36 Animation - Transition Bill Dudney Core Animation: Building Animated UI s Slide 36

37 Animation - Transition Bill Dudney Core Animation: Building Animated UI s Slide 37

38 Animation - Transition Bill Dudney Core Animation: Building Animated UI s Slide 38

39 Animation - Transition Bill Dudney Core Animation: Building Animated UI s Slide 39

40 Timing Bill Dudney Core Animation: Building Animated UI s Slide 40

41 Timing Bill Dudney Core Animation: Building Animated UI s Slide 41

42 Timing - Ease-In Bill Dudney Core Animation: Building Animated UI s Slide 42

43 Timing - Ease-In Bill Dudney Core Animation: Building Animated UI s Slide 43

44 Timing - Ease-Out Bill Dudney Core Animation: Building Animated UI s Slide 44

45 Timing - Ease-Out Bill Dudney Core Animation: Building Animated UI s Slide 45

46 Timing - Ease-In-Out Live Code Bill Dudney Core Animation: Building Animated UI s Slide 46

47 Timing - Ease-In-Out Live Code Bill Dudney Core Animation: Building Animated UI s Slide 47

48 Drawing in Layers Images Quartz Open GL Bill Dudney Core Animation: Building Animated UI s Slide 48

49 Demos Bill Dudney Core Animation: Building Animated UI s Slide 49

50 Q & A Bill Dudney Core Animation: Building Animated UI s Slide 50