cocoaheads rennes #14: ios7 controllers transitions

Report

Tags:

Post on 12-Jun-2015

2.882 Views

Category:

Technology

0 Downloads

Preview:

Click to see full reader

DESCRIPTION

La traditionnelle mise à jour annuelle de nos petits bijoux de poche est moins discrète cette année avec une remise à plat de son design … Mais il y a aussi de très nombreuses nouveautés pour les développeurs. UIKit Dynamics, les motions events et les custom transitions en font partie. Elles renouvellent notre expérience des interfaces UIKit. David Bonnet (créateur de CarMusic) est venu nous parler des custom transitions. Après une courte introduction et quelques exemples, vous devriez repartir avec plein d’idées pour personnaliser votre app…

TRANSCRIPT

iOS 7 - Controllers Transitionsvous n’aurez plus d’excuse ;-)

David BonnetOctobre 2013

CocoaHeads Rennes #1424 Octobre 2014

jeudi 24 octobre 13

jeudi 24 octobre 13

iOS 7 - Controller transitions

- Tour d’horizon... What’s new !

jeudi 24 octobre 13

iOS 7 - Controller transitions

- Tour d’horizon... What’s new !

- Controllers Transitions et Custom transitions

jeudi 24 octobre 13

iOS 7 - Controller transitions

- Tour d’horizon... What’s new !

- Controllers Transitions et Custom transitions

- Interactive transitions

jeudi 24 octobre 13

iOS 7 - Controller transitions

- Tour d’horizon... What’s new !

- Controllers Transitions et Custom transitions

- Interactive transitions

-Quelques trucs...

jeudi 24 octobre 13

Tour d’horizon... What’s newjeudi 24 octobre 13

Tour d’horizon... What’s new

jeudi 24 octobre 13

Tour d’horizon... What’s new

UIKit Dynamics UIMotion Effects

Custom Transitions with UIViewControllers UIView Animations

APIs

Easier KeyFrame animations

jeudi 24 octobre 13

Tour d’horizon... What’s new

UIKit DynamicsUIMotion Effects

Custom Transitions with UIViewControllers UIView Animations

APIs

Easier KeyFrame animations

jeudi 24 octobre 13

UIMotion Effects

jeudi 24 octobre 13

UIMotion Effects

jeudi 24 octobre 13

UIKit Dynamics

jeudi 24 octobre 13

UIKit Dynamics

- Arrivée de la physique dans UIKit !

- Gravité / Ressorts / Gestion des collisions...

- Interractions entre éléments

jeudi 24 octobre 13

Custom Transitionsjeudi 24 octobre 13

Custom TransitionsQue peux-t’on personnaliser ?

jeudi 24 octobre 13

Custom TransitionsQue peux-t’on personnaliser ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

jeudi 24 octobre 13

Custom TransitionsQuelles transitions précisément ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

jeudi 24 octobre 13

Custom TransitionsQuelles transitions précisément ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

UIModalPresentationFullScreenUIModalPresentationCustom

jeudi 24 octobre 13

Custom TransitionsQuelles transitions précisément ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

UIModalPresentationFullScreenUIModalPresentationCustom

setSelectedViewController:(UIViewController*)vcsetSelectedIndex:(NSUInteger)idx

jeudi 24 octobre 13

Custom TransitionsQuelles transitions précisément ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

UIModalPresentationFullScreenUIModalPresentationCustom

setSelectedViewController:(UIViewController*)vcsetSelectedIndex:(NSUInteger)idx

pushViewController:animated:popViewController:animated:setViewControllers:animated:

jeudi 24 octobre 13

Custom TransitionsQuelles transitions précisément ?

Presentationand Dismissals UITabBarController

UINavigationController

UICollectionViewControllerlayout-to-layout transitions

UIModalPresentationFullScreenUIModalPresentationCustom

setSelectedViewController:(UIViewController*)vcsetSelectedIndex:(NSUInteger)idx

pushViewController:animated:popViewController:animated:setViewControllers:animated:

setUseLayoutToLayoutNavigationTransitions:

jeudi 24 octobre 13

Demojeudi 24 octobre 13

Anatomie d’une transitionDébut de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

View Controllers Views Containment Controllers views Superview

Début de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Window

Parent View

View

View Controllers Views Containment Controllers views Superview

Début de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Window

Parent View

Child A View

View View

View Controllers Views Containment Controllers views Superview

Début de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Window

Parent View

View

Fin de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Window

Parent View

View

View Controllers Views Containment Controllers views Superview

Fin de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Child B

Window

Parent View

View

View Controllers Views Containment Controllers views Superview

Fin de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Child B

Window

Parent View

Child B View

View View

View Controllers Views Containment Controllers views Superview

Fin de la transition

jeudi 24 octobre 13

Anatomie d’une transition

Parent VC

Child A

Child B

Window

Parent View

Child B View

View View

View Controllers Views Containment Controllers views Superview

Child A

View View

Fin de la transition

jeudi 24 octobre 13

Anatomie d’une transitionParent

Child A

Child B

Window

ViewChild B

View View

Child A

View View

Etat intérmédiaire

jeudi 24 octobre 13

Container view

Anatomie d’une transitionParent

Child A

Child B

Window

ViewChild B

View ViewChild A

View View

Etat intérmédiaire

jeudi 24 octobre 13

Container view

Anatomie d’une transitionParent

Child A

Child B

Window

ViewChild B

View View

Child A

View View

Etat intérmédiaire

jeudi 24 octobre 13

Container view

Anatomie d’une transitionParent

Child A

Child B

Window

View

Child B

View View

Child A

View View

Etat intérmédiaire

jeudi 24 octobre 13

Anatomie d’une transition

jeudi 24 octobre 13

Anatomie d’une transition- Ce qu’il faut retenir :

- iOS crée la container view

- Calcule la position de départ et de fin

- Notifie les view controllers des mouvements(Mise à jour des structures, Callbacks, ...)

jeudi 24 octobre 13

Anatomie d’une transition- Ce qu’il faut retenir :

- iOS crée la container view

- Calcule la position de départ et de fin

- Notifie les view controllers des mouvements(Mise à jour des structures, Callbacks, ...)

L’éventuelle animation et/ou interraction doit être définie

jeudi 24 octobre 13

Code et nouvelles APIsjeudi 24 octobre 13

Custom transitions : les protocols

jeudi 24 octobre 13

Custom transitions : les protocols- Les contrôleurs d’animations et d’interactions doivent

être fournis par les delegates respectifs<UIViewControllerTransitioningDelegate><UINavigationControllerDelegate><UITabBarControllerDelegate>

jeudi 24 octobre 13

Custom transitions : les protocols- Les contrôleurs d’animations et d’interactions doivent

être fournis par les delegates respectifs<UIViewControllerTransitioningDelegate><UINavigationControllerDelegate><UITabBarControllerDelegate>

- Les contrôleurs d’animations répondent au protocol<UIViewControllerAnimatedTransitioning>

jeudi 24 octobre 13

Custom transitions : les protocols- Les contrôleurs d’animations et d’interactions doivent

être fournis par les delegates respectifs<UIViewControllerTransitioningDelegate><UINavigationControllerDelegate><UITabBarControllerDelegate>

- Les contrôleurs d’animations répondent au protocol<UIViewControllerAnimatedTransitioning>

- Les contrôleurs d’interactions répondent au protocol<UIViewControllerInteractiveTransitioning>

jeudi 24 octobre 13

Custom transitions : les protocols- Les contrôleurs d’animations et d’interactions doivent

être fournis par les delegates respectifs<UIViewControllerTransitioningDelegate><UINavigationControllerDelegate><UITabBarControllerDelegate>

- Les contrôleurs d’animations répondent au protocol<UIViewControllerAnimatedTransitioning>

- Les contrôleurs d’interactions répondent au protocol<UIViewControllerInteractiveTransitioning>

- iOS fourni aux contrôleurs un contexte de transition <UIViewControllerContextTransitioning>

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

@protocol UIViewControllerContextTransitioning <NSObject>

// The view in which the animated transition should take place. - (UIView *)containerView;

// Two keys for the method below are currently defined by the system // UITransitionContextToViewControllerKey // UITransitionContextFromViewControllerKey

- (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

// This MUST be called whenever a transition completes (or is cancelled.) - (void)completeTransition:(BOOL)didComplete;

...

@end

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

@protocol UIViewControllerContextTransitioning <NSObject>

// The view in which the animated transition should take place. - (UIView *)containerView;

// Two keys for the method below are currently defined by the system // UITransitionContextToViewControllerKey // UITransitionContextFromViewControllerKey

- (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

// This MUST be called whenever a transition completes (or is cancelled.) - (void)completeTransition:(BOOL)didComplete;

...

@end

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

@protocol UIViewControllerContextTransitioning <NSObject>

// The view in which the animated transition should take place. - (UIView *)containerView;

// Two keys for the method below are currently defined by the system // UITransitionContextToViewControllerKey // UITransitionContextFromViewControllerKey

- (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

// This MUST be called whenever a transition completes (or is cancelled.) - (void)completeTransition:(BOOL)didComplete;

...

@end

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

@protocol UIViewControllerContextTransitioning <NSObject>

// The view in which the animated transition should take place. - (UIView *)containerView;

// Two keys for the method below are currently defined by the system // UITransitionContextToViewControllerKey // UITransitionContextFromViewControllerKey

- (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

// This MUST be called whenever a transition completes (or is cancelled.) - (void)completeTransition:(BOOL)didComplete;

...

@end

jeudi 24 octobre 13

<UIViewControllerContextTransitioning>//Le contexte de transition fourni par iOS

@protocol UIViewControllerContextTransitioning <NSObject>

// The view in which the animated transition should take place. - (UIView *)containerView;

// Two keys for the method below are currently defined by the system // UITransitionContextToViewControllerKey // UITransitionContextFromViewControllerKey

- (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

// This MUST be called whenever a transition completes (or is cancelled.) - (void)completeTransition:(BOOL)didComplete;

...

@end

jeudi 24 octobre 13

<UIViewControllerAnimatedTransitioning>//Le contrôleur d’animation

jeudi 24 octobre 13

<UIViewControllerAnimatedTransitioning>//Le contrôleur d’animation

@protocol UIViewControllerAnimatedTransitioning <NSObject>

- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)ctx;

// This method can only be a nop if the transition is interactive and not a// percentDriven interactive transition.- (void)animateTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

// This is a convenience and if implemented will be invoked by the system when the// transition context's completeTransition: method is invoked.- (void)animationEnded:(BOOL) transitionCompleted;

@end

jeudi 24 octobre 13

<UIViewControllerAnimatedTransitioning>//Le contrôleur d’animation

@protocol UIViewControllerAnimatedTransitioning <NSObject>

- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)ctx;

// This method can only be a nop if the transition is interactive and not a// percentDriven interactive transition.- (void)animateTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

// This is a convenience and if implemented will be invoked by the system when the// transition context's completeTransition: method is invoked.- (void)animationEnded:(BOOL) transitionCompleted;

@end

jeudi 24 octobre 13

<UIViewControllerAnimatedTransitioning>//Le contrôleur d’animation

@protocol UIViewControllerAnimatedTransitioning <NSObject>

- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)ctx;

// This method can only be a nop if the transition is interactive and not a// percentDriven interactive transition.- (void)animateTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

// This is a convenience and if implemented will be invoked by the system when the// transition context's completeTransition: method is invoked.- (void)animationEnded:(BOOL) transitionCompleted;

@end

jeudi 24 octobre 13

<UIViewControllerAnimatedTransitioning>//Le contrôleur d’animation

@protocol UIViewControllerAnimatedTransitioning <NSObject>

- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)ctx;

// This method can only be a nop if the transition is interactive and not a// percentDriven interactive transition.- (void)animateTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

// This is a convenience and if implemented will be invoked by the system when the// transition context's completeTransition: method is invoked.- (void)animationEnded:(BOOL) transitionCompleted;

@end

jeudi 24 octobre 13

<UIViewControllerTransitioningDelegate>//Celui qui fourni l’animateur et l’interacteur

jeudi 24 octobre 13

<UIViewControllerTransitioningDelegate>//Celui qui fourni l’animateur et l’interacteur

@protocol UIViewControllerTransitioningDelegate <NSObject>@optional- (id <UIViewControllerAnimatedTransitioning>) animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source;

- (id <UIViewControllerAnimatedTransitioning>) animationControllerForDismissedController:(UIViewController *)dismissed;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForPresentation:(id <UIViewControllerAnimatedTransitioning>)a;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForDismissal:(id <UIViewControllerAnimatedTransitioning>)a;

@end

jeudi 24 octobre 13

<UIViewControllerTransitioningDelegate>//Celui qui fourni l’animateur et l’interacteur

@protocol UIViewControllerTransitioningDelegate <NSObject>@optional- (id <UIViewControllerAnimatedTransitioning>) animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source;

- (id <UIViewControllerAnimatedTransitioning>) animationControllerForDismissedController:(UIViewController *)dismissed;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForPresentation:(id <UIViewControllerAnimatedTransitioning>)a;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForDismissal:(id <UIViewControllerAnimatedTransitioning>)a;

@end

jeudi 24 octobre 13

<UIViewControllerTransitioningDelegate>//Celui qui fourni l’animateur et l’interacteur

@protocol UIViewControllerTransitioningDelegate <NSObject>@optional- (id <UIViewControllerAnimatedTransitioning>) animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source;

- (id <UIViewControllerAnimatedTransitioning>) animationControllerForDismissedController:(UIViewController *)dismissed;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForPresentation:(id <UIViewControllerAnimatedTransitioning>)a;

- (id <UIViewControllerInteractiveTransitioning>) interactionControllerForDismissal:(id <UIViewControllerAnimatedTransitioning>)a;

@end

jeudi 24 octobre 13

Demojeudi 24 octobre 13

UIView new Animation APIs

jeudi 24 octobre 13

UIView new Animation APIs- Disabling and enabling animations

+(void)setAnimationsEnabled:(BOOL)

+(void)performWithoutAnimation:(void ^(void))actions;

jeudi 24 octobre 13

UIView new Animation APIs- Disabling and enabling animations

+(void)setAnimationsEnabled:(BOOL)

+(void)performWithoutAnimation:(void ^(void))actions;

- Spring animations (Damping ratio / Initial Spring Velocity)

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay usingSpringWithDamping:(CGFloat)dampingRatio initialSpringVelocity:(CGFloat)velocity options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion

jeudi 24 octobre 13

UIView new Animation APIs

jeudi 24 octobre 13

UIView new Animation APIs- KeyFrame animations

+(void)animateKeyframesWithDuration... (~ CAKeyFrameAnimation)

+(void)animateWithDuration... (~ CABasicAnimation)

jeudi 24 octobre 13

UIView new Animation APIs- KeyFrame animations

+(void)animateKeyframesWithDuration... (~ CAKeyFrameAnimation)

+(void)animateWithDuration... (~ CABasicAnimation)

- UIView snapshots- (UIView *)snapshotViewAfterScreenUpdates:(BOOL)afterUpdates

- (UIView *)resizableSnapshotViewFromRect:(CGRect)rect afterScreenUpdates:(BOOL)afterUpdates withCapInsets:(UIEdgeInsets)capInsets

jeudi 24 octobre 13

UIView new Animation APIs- KeyFrame animations

+(void)animateKeyframesWithDuration... (~ CAKeyFrameAnimation)

+(void)animateWithDuration... (~ CABasicAnimation)

- UIView snapshots- (UIView *)snapshotViewAfterScreenUpdates:(BOOL)afterUpdates

- (UIView *)resizableSnapshotViewFromRect:(CGRect)rect afterScreenUpdates:(BOOL)afterUpdates withCapInsets:(UIEdgeInsets)capInsets

- UIKit Dynamicsjeudi 24 octobre 13

Vous savez désormais écrire des transitions de présentation

personnalisées...

jeudi 24 octobre 13

Vous savez désormais écrire des transitions de présentation

personnalisées...

Comment interragir avec elles...?

jeudi 24 octobre 13

Interactive Transitionsjeudi 24 octobre 13

Interactive Transitions

UINavigationControllerInteractive pop gesture sur toutes les apps

iOS 7

jeudi 24 octobre 13

Interactive Transitions

UINavigationControllerInteractive pop gesture sur toutes les apps

iOS 7

Custom interactive transitionsPas forcément pilotées par un geste

Gestion de l’annulation

jeudi 24 octobre 13

Interactive Transitions

UINavigationControllerInteractive pop gesture sur toutes les apps

iOS 7

Custom interactive transitionsPas forcément pilotées par un geste

Gestion de l’annulation

UIPercentDrivenInteractiveTransition

jeudi 24 octobre 13

États d’une transition interactiveÉtats

Acteurs

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

Fin de la transition interactive

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

Fin de la transition interactive

Transition annulée

Transition terminée

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

Fin de la transition interactive

Transition annulée

Transition terminée

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

Fin de la transition interactive

Transition annulée

Transition terminée

Transition achevée

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

États d’une transition interactive

Aucune transition

Début de la transition interactive

Mise à jour transition interactive

Fin de la transition interactive

Transition annulée

Transition terminée

Transition achevée

États

Acteurs

Interactive Event Handler Interactor Animator Context

jeudi 24 octobre 13

<UIViewControllerInteractiveTransitioning>//Le contrôlleur d’interractions

jeudi 24 octobre 13

<UIViewControllerInteractiveTransitioning>//Le contrôlleur d’interractions

@protocol UIViewControllerInteractiveTransitioning <NSObject>

- (void)startInteractiveTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

- (CGFloat)completionSpeed;

- (UIViewAnimationCurve)completionCurve;

@end

jeudi 24 octobre 13

<UIViewControllerInteractiveTransitioning>//Le contrôlleur d’interractions

@protocol UIViewControllerInteractiveTransitioning <NSObject>

- (void)startInteractiveTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

- (CGFloat)completionSpeed;

- (UIViewAnimationCurve)completionCurve;

@end

jeudi 24 octobre 13

<UIViewControllerInteractiveTransitioning>//Le contrôlleur d’interractions

@protocol UIViewControllerInteractiveTransitioning <NSObject>

- (void)startInteractiveTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

- (CGFloat)completionSpeed;

- (UIViewAnimationCurve)completionCurve;

@end

jeudi 24 octobre 13

<UIViewControllerInteractiveTransitioning>//Le contrôlleur d’interractions

@protocol UIViewControllerInteractiveTransitioning <NSObject>

- (void)startInteractiveTransition:(id <UIViewControllerContextTransitioning>)ctx;

@optional

- (CGFloat)completionSpeed;

- (UIViewAnimationCurve)completionCurve;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

<UIPercentDrivenInteractiveTransition>//La manière la plus simple

// The associated animation controller must animate its transition using UIView animation APIs. @interface UIPercentDrivenInteractiveTransition : NSObject <UIViewControllerInteractiveTransitioning>

@property (readonly) CGFloat duration;

// The last percentComplete value specified by updateInteractiveTransition: @property (readonly) CGFloat percentComplete;

// completionSpeed defaults to 1.0 which corresponds to a completion duration of // (1 - percentComplete)*duration. It must be greater than 0.0. @property (nonatomic,assign) CGFloat completionSpeed;

// When the interactive part of the transition has completed, this property can // be set to indicate a different animation curve. @property (nonatomic,assign) UIViewAnimationCurve completionCurve;

// Used instead of the corresponding context methods. - (void)updateInteractiveTransition:(CGFloat)percentComplete; - (void)cancelInteractiveTransition; - (void)finishInteractiveTransition;

@end

jeudi 24 octobre 13

Demojeudi 24 octobre 13

UICollectionView interactive transitions

jeudi 24 octobre 13

UICollectionView interactive transitions- Le suivi de la progression via transitionProgress

- de 0.f à 1.1f (pour l’effet de bouncing)

jeudi 24 octobre 13

UICollectionView interactive transitions- Le suivi de la progression via transitionProgress

- de 0.f à 1.1f (pour l’effet de bouncing)

- Nouvelles méthodes sur UICollectionView - (UICollectionViewTransitionLayout *) startInteractiveTransitionToCollectionViewLayout:completion: - (void)finishInteractiveTransition - (void)cancelInteractiveTransition

jeudi 24 octobre 13

UICollectionView interactive transitions- Le suivi de la progression via transitionProgress

- de 0.f à 1.1f (pour l’effet de bouncing)

- Nouvelles méthodes sur UICollectionView - (UICollectionViewTransitionLayout *) startInteractiveTransitionToCollectionViewLayout:completion: - (void)finishInteractiveTransition - (void)cancelInteractiveTransition

- Enrichissement du delegate- (UICollectionViewTransitionLayout *)collectionView:(UICollectionView*)v

transitionLayoutForOldLayout:(UICollectionViewLayout*)o newLayout:(UICollectionViewLayout*)n

jeudi 24 octobre 13

Quelques trucs...jeudi 24 octobre 13

Appearance callbacks (with cancel)

jeudi 24 octobre 13

Appearance callbacks (with cancel)

Fin de la transition interactive

Transition annulée

Transition terminée

Transition achevée

États de transition d’une interaction

jeudi 24 octobre 13

Appearance callbacks (with cancel)

Fin de la transition interactive

Transition annulée

Transition terminée

Transition achevée

États de transition d’une interaction

Appearing Appeared

DisappearingDisappeared

États d’apparance d’un contrôleur

jeudi 24 octobre 13

Appearance callbacks (with cancel)

Fin de la transition interactive

Transition annulée

Transition terminée

Transition achevée

États de transition d’une interaction

Appearing Appeared

DisappearingDisappeared

États d’apparance d’un contrôleur

viewDidAppear: n’est pas toujours appelé après viewWillAppear:jeudi 24 octobre 13

<UIViewControllerTransitionCoordinator>//Connaître l’état de votre contrôleur

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinator>//Connaître l’état de votre contrôleur

@protocol UIViewControllerTransitionCoordinator <UIViewControllerTransitionCoordinatorContext>

@optional

- (BOOL) notifyWhenInteractionEndsUsingBlock: (void (^ (id<UIViewControllerTransitionCoordinatorContext)handler;

- (BOOL) animatorAlongsideTransition: (void (^) (id <UIViewControllerTransitionCoordinatorContext)a; completion:(void (^)(id<UIViewControllerTransitionCoordinatorContext)c;

- (BOOL) animatorAlongsideTransitionInView:(UIView *)view animation: (void (^) (id<UIViewControllerTransitionCoordinatorContext)a;

@end

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinator>//Connaître l’état de votre contrôleur

@protocol UIViewControllerTransitionCoordinator <UIViewControllerTransitionCoordinatorContext>

@optional

- (BOOL) notifyWhenInteractionEndsUsingBlock: (void (^ (id<UIViewControllerTransitionCoordinatorContext)handler;

- (BOOL) animatorAlongsideTransition: (void (^) (id <UIViewControllerTransitionCoordinatorContext)a; completion:(void (^)(id<UIViewControllerTransitionCoordinatorContext)c;

- (BOOL) animatorAlongsideTransitionInView:(UIView *)view animation: (void (^) (id<UIViewControllerTransitionCoordinatorContext)a;

@end

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinator>//Connaître l’état de votre contrôleur

@protocol UIViewControllerTransitionCoordinator <UIViewControllerTransitionCoordinatorContext>

@optional

- (BOOL) notifyWhenInteractionEndsUsingBlock: (void (^ (id<UIViewControllerTransitionCoordinatorContext)handler;

- (BOOL) animatorAlongsideTransition: (void (^) (id <UIViewControllerTransitionCoordinatorContext)a; completion:(void (^)(id<UIViewControllerTransitionCoordinatorContext)c;

- (BOOL) animatorAlongsideTransitionInView:(UIView *)view animation: (void (^) (id<UIViewControllerTransitionCoordinatorContext)a;

@end

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinatorContext>//Le contexte de transition associé

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinatorContext>//Le contexte de transition associé

@protocol UIViewControllerTransitionCoordinatorContext <NSObject>

- (UIView *)containerView; - (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

- (BOOL) isCancelled; - (BOOL) initiallyInteractive; - (BOOL) isInteractive;

@end

jeudi 24 octobre 13

<UIViewControllerTransitionCoordinatorContext>//Le contexte de transition associé

@protocol UIViewControllerTransitionCoordinatorContext <NSObject>

- (UIView *)containerView; - (UIViewController *) viewControllerForKey:(NSString *)key; - (CGRect) initialFrameForViewController:(UIViewController *)vc; - (CGRect) finalFrameForViewController:(UIViewController *)vc;

- (BOOL) isCancelled; - (BOOL) initiallyInteractive; - (BOOL) isInteractive;

@end

jeudi 24 octobre 13

viewWillAppear: implementation (in context)//Pour éviter les problèmes

jeudi 24 octobre 13

viewWillAppear: implementation (in context)//Pour éviter les problèmes

- (void) viewWillAppear:(BOOL)animated{ [self doSomeSideEffectsAssumingViewDidAppearIsGoingToBeCalled]; id <UIViewControllerTransitionCoordinator> coordinator; coordinator = [self transitionCoordinator]; if(coordinator && [coordinator initiallyInteractive]) { [transitionCoordinator notifyWhenInteractionEndsUsingBlock: ^(id <UIViewControllerTransitionCoordinatorContext> ctx) { if(ctx.isCancelled) { [self undoSideEffects]; } }]; }}

jeudi 24 octobre 13

viewWillAppear: implementation (in context)//Pour éviter les problèmes

- (void) viewWillAppear:(BOOL)animated{ [self doSomeSideEffectsAssumingViewDidAppearIsGoingToBeCalled]; id <UIViewControllerTransitionCoordinator> coordinator; coordinator = [self transitionCoordinator]; if(coordinator && [coordinator initiallyInteractive]) { [transitionCoordinator notifyWhenInteractionEndsUsingBlock: ^(id <UIViewControllerTransitionCoordinatorContext> ctx) { if(ctx.isCancelled) { [self undoSideEffects]; } }]; }}

jeudi 24 octobre 13

viewWillAppear: implementation (in context)//Pour éviter les problèmes

- (void) viewWillAppear:(BOOL)animated{ [self doSomeSideEffectsAssumingViewDidAppearIsGoingToBeCalled]; id <UIViewControllerTransitionCoordinator> coordinator; coordinator = [self transitionCoordinator]; if(coordinator && [coordinator initiallyInteractive]) { [transitionCoordinator notifyWhenInteractionEndsUsingBlock: ^(id <UIViewControllerTransitionCoordinatorContext> ctx) { if(ctx.isCancelled) { [self undoSideEffects]; } }]; }}

jeudi 24 octobre 13

viewWillAppear: implementation (in context)//Pour éviter les problèmes

- (void) viewWillAppear:(BOOL)animated{ [self doSomeSideEffectsAssumingViewDidAppearIsGoingToBeCalled]; id <UIViewControllerTransitionCoordinator> coordinator; coordinator = [self transitionCoordinator]; if(coordinator && [coordinator initiallyInteractive]) { [transitionCoordinator notifyWhenInteractionEndsUsingBlock: ^(id <UIViewControllerTransitionCoordinatorContext> ctx) { if(ctx.isCancelled) { [self undoSideEffects]; } }]; }}

jeudi 24 octobre 13

Communauté : VCTransitionsLibrary

jeudi 24 octobre 13

Communauté : VCTransitionsLibrary

https://github.com/ColinEberhardt/VCTransitionsLibrary

pod ‘VCTransitionsLibrary’, ‘~> 1.1’

jeudi 24 octobre 13

https://github.com/ColinEberhardt/VCTransitionsLibrary
https://github.com/ColinEberhardt/VCTransitionsLibrary

Références

jeudi 24 octobre 13

Références

-WWDC 2013 : Session 218 - Custom Transitions Using View Controllers by Bruce D. Nilo

- Schémas d’interactions / Sample code...

- Teehan+lax : Custom UIViewController transitions

- VCTransitionLibrary by ColinEberhardt on GitHub

- Teehan+lax : Introduction to UIKitDynamics

jeudi 24 octobre 13

http://www.teehanlax.com/blog/custom-uiviewcontroller-transitions/
http://www.teehanlax.com/blog/custom-uiviewcontroller-transitions/
https://github.com/ColinEberhardt/VCTransitionsLibrary
https://github.com/ColinEberhardt/VCTransitionsLibrary
http://www.teehanlax.com/blog/introduction-to-uikit-dynamics/
http://www.teehanlax.com/blog/introduction-to-uikit-dynamics/

Merci de votre attention

jeudi 24 octobre 13

Merci de votre attention

Des Questions ?

jeudi 24 octobre 13

CocoaHeads #14http://cocoaheads.fr/rennes

julien@cocoaheads.frthomas.dupont@cocoaheads.fr

iOS 7 - Controller TransitionsMail : david.bonnet@cocoaheads.fr

Twitter : @iGranDav GitHub : http://github.com/iGranDav

App : CarMusic (en préparation pour iOS 7) http://carmusicapp.com/

david.bonnet@cocoaheads.fr

jeudi 24 octobre 13

http://cocoaheads.fr
http://cocoaheads.fr
http://cocoaheads.fr
http://cocoaheads.fr
http://cocoaheads.fr
http://cocoaheads.fr
mailto:david.bonnet@cocoaheads.fr?subject=
mailto:david.bonnet@cocoaheads.fr?subject=
http://twitter.com/iGranDav
http://twitter.com/iGranDav
http://github.com/iGranDav
http://github.com/iGranDav
http://carmusicapp.com/
http://carmusicapp.com/
http://carmusicapp.com
http://carmusicapp.com
http://cocoaheads.fr
http://cocoaheads.fr

top related

ios7: hits & misses
Technology
cocoaheads bratislava #1 - swift
Software
cocoaheads rennes #3 : bien débuter sur ios
Technology
ui debugging - cocoaheads dresden (english)
Technology
cocoaheads toulouse - ios techtalk - mélanie bessagnet
Technology
i pad basics ios7
Education
functional reactive programming (cocoaheads bratislava)
Technology
i pad basics in ios7
Technology
updating your ipad to ios7
Documents
ios7 features
Technology
ios7 presentaion
Internet
cocoaheads - notifications
Engineering
ios7 : looking beyond parallax
Technology
mobile devops - cocoaheads be edition
Engineering
text kit ios7
Technology
ios 2d gamedev @ cocoaheads
Internet
cocoaheads lille - september 2013
Technology
parent handbook - ios7 setup guide.pdf
Documents
cocoaheads rennes #1 : internationalisation
Technology
ipad basics training (ios7)
Education