Custom Animations and Transitions on iOS

Slide 1

Slide 1 text

NSIstanbul C O M M U N I T Y

Slide 2

Slide 2 text

Custom Animations and Transitions on iOS

Slide 3

Slide 3 text

Before

Slide 4

Slide 4 text

Interaction Designer

Slide 5

Slide 5 text

Form

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Origami

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

Form

Slide 10

Slide 10 text

Custom Animations

Slide 11

Slide 11 text

A Primer on Animations

Slide 12

Slide 12 text

A Primer on Animations [UIView animateWithDuration:1.0 animations:^{ [self.view layoutIfNeeded]; } completion:^{ }]; CAAnimation

Slide 13

Slide 13 text

A Primer on Animations UIView CALayer

Slide 14

Slide 14 text

A Primer on Animations CALayer [_loadingView.layer addAnimation:rotateAnimation forKey:@"rotateAnimation"];

Slide 15

Slide 15 text

A Primer on Animations CAAnimation CABasicAnimation CAKeyframeAnimation CAGroupAnimation

Slide 16

Slide 16 text

A Primer on Animations CAAnimation Keys rotation scale position height origin strokeStart strokeEnd width

Slide 17

Slide 17 text

Basic Animations

Slide 18

Slide 18 text

Custom Animations

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

These animations require a lot of testing and trying.

Slide 22

Slide 22 text

These animations require a lot of testing and trying. How?

Slide 23

Slide 23 text

QuartzCode

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

Shape Particle Emitter Animations Chaining Replicator Image Text

Slide 26

Slide 26 text

Very Complex Animations

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

Custom Animations

Slide 29

Slide 29 text

Custom Transitions

Slide 30

Slide 30 text

iOS6 UIModalTransitions UINavigationController Transitions UIModalTransitionStyleCoverVertical UIModalTransitionStylePartialCurl UIModalTransitionStyleHorizontalFlip UIModalTransitionStyleCrossDissolve UIViewAnimationTransitionNone UIViewAnimationTransitionFlipFromLeft UIViewAnimationTransitionFlipFromRight UIViewAnimationTransitionCurlUp UIViewAnimationTransitionCurlDown Custom Transitions

Slide 31

Slide 31 text

Custom Transitions iOS7 toVC.presentationStyle = UIModalPresentationCustom; toVC.transitioningDelegate = toVC;

Slide 32

Slide 32 text

-(id)animationControllerForPresentedController: (UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source -(id)animationControllerForDismissedController: (UIViewController *)dismissed

Slide 33

Slide 33 text

-(NSTimeInterval)transitionDuration: (id)transitionContext -(void)animateTransition: (id)transitionContext

Slide 34

Slide 34 text

transitionContext UIViewController *fromViewController = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey]; UIViewController *toViewController = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];

Slide 35

Slide 35 text

- (id) navigationController:(UINavigationController *)navigationController animationControllerForOperation:(UINavigationControllerOperation)operation fromViewController:(UIViewController*)fromVC toViewController:(UIViewController*)toVC { if (operation == UINavigationControllerOperationPush) { return self.animator; } return nil; } Navigation Transitions

Slide 36

Slide 36 text

Thanks