refactored transition animations (#2604)

* refactored transition animations

* unit test fix

lib/ios/RNNAnimator.h

 #import <Foundation/Foundation.h>
 #import <UIKit/UIKit.h>
 #import "RNNElementView.h"
+#import "RNNTransitionOptions.h"
 
 @interface RNNAnimator : NSObject <UIViewControllerAnimatedTransitioning>
 
--(instancetype)initWithAnimationsDictionary:(NSDictionary *)animationsDic;
--(void)setupTransition:(NSDictionary*)data;
+-(instancetype)initWithTransitionOptions:(RNNTransitionOptions *)transitionOptions;
 
 @end

lib/ios/RNNAnimator.m

 #import "RNNAnimatedView.h"
 
 @interface  RNNAnimator()
-@property (nonatomic, strong)NSArray* animations;
-@property (nonatomic)double duration;
-@property (nonatomic)double springDamping;
-@property (nonatomic)double springVelocity;
+@property (nonatomic, strong) RNNTransitionOptions* transitionOptions;
 @property (nonatomic, strong) RNNInteractivePopAnimator* interactivePopAnimator;
 @property (nonatomic) BOOL backButton;
 @property (nonatomic, strong) UIViewController* fromVC;
 
 @implementation RNNAnimator
 
-- (instancetype)initWithAnimationsDictionary:(NSDictionary *)animationsDic {
+-(instancetype)initWithTransitionOptions:(RNNTransitionOptions *)transitionOptions {
 	self = [super init];
-	if (animationsDic) {
-		[self setupTransition:animationsDic];
+	if (transitionOptions) {
+		[self setupTransition:transitionOptions];
 	} else {
 		return nil;
 	}
 	return self;
 }
 
--(void)setupTransition:(NSDictionary*)data{
-	if ([data objectForKey:@"animations"]) {
-		self.animations= [data objectForKey:@"animations"];
-	} else {
+-(void)setupTransition:(RNNTransitionOptions *)transitionOptions {
+	self.transitionOptions = transitionOptions;
+	if (!transitionOptions.animations) {
 		[[NSException exceptionWithName:NSInvalidArgumentException reason:@"No animations" userInfo:nil] raise];
 	}
-	if ([data objectForKey:@"duration"]) {
-		self.duration = [[data objectForKey:@"duration"] doubleValue];
-	} else {
-		self.duration = 0.7;
-	}
-	if ([data objectForKey:@"springDamping"]) {
-		self.springDamping = [[data objectForKey:@"springDamping"] doubleValue];
-	} else {
-		self.springDamping = 0.85;
-	}
-	if ([data objectForKey:@"springVelocity"]) {
-		self.springVelocity= [[data objectForKey:@"springVelocity"] doubleValue];
-	} else {
-		self.springVelocity = 0.8;
-	}
 	
 	self.backButton = false;
 }
 
 -(NSArray*)prepareSharedElementTransition:(NSArray*)RNNSharedElementsToVC
 						andfromVCElements:(NSArray*)RNNSharedElementsFromVC
-						withComponentView:(UIView*)componentView
-{
+						withComponentView:(UIView*)componentView {
 	NSMutableArray* transitions = [NSMutableArray new];
-	for (NSDictionary* transition in self.animations) {
+	for (NSDictionary* transition in self.transitionOptions.animations) {
 		RNNTransitionStateHolder* transitionStateHolder = [[RNNTransitionStateHolder alloc] initWithTransition:transition];
 		RNNElementFinder* elementFinder = [[RNNElementFinder alloc] initWithToVC:self.toVC andfromVC:self.fromVC];
 		[elementFinder findElementsInTransition:transitionStateHolder];
 		[componentView bringSubviewToFront:animatedView];
 		transitionStateHolder.animatedView = animatedView;
 		[transitions addObject:transitionStateHolder];
-		if (transitionStateHolder.isSharedElementTransition){
+		if (transitionStateHolder.isSharedElementTransition) {
 			[transitionStateHolder.toElement setHidden: YES];
 		}
 		[transitionStateHolder.fromElement setHidden:YES];
 
 
 -(void)animateComplition:(NSArray*)transitions fromVCSnapshot:(UIView*)fromSnapshot andTransitioningContext:(id<UIViewControllerContextTransitioning>)transitionContext {
-	[UIView animateWithDuration:[self transitionDuration:transitionContext ] delay:0 usingSpringWithDamping:self.springDamping initialSpringVelocity:self.springVelocity options:UIViewAnimationOptionCurveEaseOut  animations:^{
+	[UIView animateWithDuration:[self transitionDuration:transitionContext] delay:0 usingSpringWithDamping:[self.transitionOptions.springDamping doubleValue] initialSpringVelocity:[self.transitionOptions.springVelocity doubleValue] options:UIViewAnimationOptionCurveEaseOut  animations:^{
 				self.toVC.view.alpha = 1;
 			} completion:^(BOOL finished) {
 				for (RNNTransitionStateHolder* transition in transitions ) {
 			}];
 }
 
-- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext
-{
-	return self.duration;
+- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext {
+	return [self.transitionOptions.duration doubleValue];
 }
-- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext
-{
+
+- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext {
 	UIViewController* toVC   = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
 	UIViewController* fromVC  = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
 	UIView* componentView = [transitionContext containerView];
 	[self animateComplition:transitions fromVCSnapshot:fromSnapshot andTransitioningContext:transitionContext];
 	[self animateTransitions:transitions];
 }
-@end
-
-
 
+@end

lib/ios/RNNCommandsHandler.m

 		[_controllerFactory.eventEmitter sendNavigationEvent:[RNNNavigationEvent create:kPop fromComponent:nil toComponent:componentId]];
 		completion();
 	}];
+	
 	NSDictionary* animationData = options[@"customTransition"];
-	if (animationData){
-		if ([animationData objectForKey:@"animations"]) {
-			[_navigationStackManager pop:componentId withAnimationData:animationData];
+	RNNTransitionOptions* transitionOptions = [[RNNTransitionOptions alloc] initWithDict:animationData];
+	
+	if (transitionOptions){
+		if (transitionOptions.animations) {
+			[_navigationStackManager pop:componentId withTransitionOptions:transitionOptions];
 		} else {
 			[[NSException exceptionWithName:NSInvalidArgumentException reason:@"unsupported transitionAnimation" userInfo:nil] raise];
 		}
 	} else {
-		[_navigationStackManager pop:componentId withAnimationData:nil];
+		[_navigationStackManager pop:componentId withTransitionOptions:nil];
 	}
 	[CATransaction commit];
 }

lib/ios/RNNControllerFactory.m

 
 - (UIViewController<RNNRootViewProtocol> *)createComponent:(RNNLayoutNode*)node {
 	NSString* name = node.data[@"name"];
-	NSDictionary* customTransition = node.data[@"customTransition"];
-	RNNAnimator* animator = [[RNNAnimator alloc] initWithAnimationsDictionary:customTransition];
 	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:node.data[@"options"]];
 	options.defaultOptions = _defaultOptions;
 	NSString* componentId = node.nodeId;
-	RNNRootViewController* component = [[RNNRootViewController alloc] initWithName:name withOptions:options withComponentId:componentId rootViewCreator:_creator eventEmitter:_eventEmitter animator:animator];
+	RNNRootViewController* component = [[RNNRootViewController alloc] initWithName:name withOptions:options withComponentId:componentId rootViewCreator:_creator eventEmitter:_eventEmitter];
 	CGSize availableSize = UIApplication.sharedApplication.delegate.window.bounds.size;
 	[_bridge.uiManager setAvailableSize:availableSize forRootView:component.view];
 	

lib/ios/RNNNavigationOptions.h

 #import "RNNTopTabOptions.h"
 #import "RNNTopTabsOptions.h"
 #import "RNNOverlayOptions.h"
+#import "RNNTransitionOptions.h"
 
 extern const NSInteger BLUR_STATUS_TAG;
 extern const NSInteger BLUR_TOPBAR_TAG;
 @property (nonatomic, strong) RNNTopTabOptions* topTab;
 @property (nonatomic, strong) RNNSideMenuOptions* sideMenu;
 @property (nonatomic, strong) RNNOverlayOptions* overlay;
+@property (nonatomic, strong) RNNTransitionOptions* customTransition;
 
 @property (nonatomic, strong) RNNNavigationOptions* defaultOptions;
 
 @property (nonatomic, strong) UIImage* backgroundImage;
 @property (nonatomic, strong) UIImage* rootBackgroundImage;
 
-
 - (UIInterfaceOrientationMask)supportedOrientations;
 
 

lib/ios/RNNNavigationOptions.m

 	self.bottomTab = [[RNNBottomTabOptions alloc] initWithDict:[options objectForKey:@"bottomTab"]];
 	self.overlay = [[RNNOverlayOptions alloc] initWithDict:[options objectForKey:@"overlay"]];
 	self.animated = [options objectForKey:@"animated"];
+	self.customTransition = [[RNNTransitionOptions alloc] initWithDict:[options objectForKey:@"customTransition"]];
 	
 	return self;
 }

lib/ios/RNNNavigationStackManager.h

 
 
 -(void)push:(UIViewController<RNNRootViewProtocol>*)newTop onTop:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
--(void)pop:(NSString*)componentId withAnimationData:(NSDictionary*)animationData;
+-(void)pop:(NSString*)componentId withTransitionOptions:(RNNTransitionOptions*)transitionOptions;
 -(void)popTo:(NSString*)componentId;
 -(void)popToRoot:(NSString*)componentId;
 

lib/ios/RNNNavigationStackManager.m

 	self.fromVC = nil;
 }
 
--(void)pop:(NSString *)componentId withAnimationData:(NSDictionary *)animationData {
+-(void)pop:(NSString *)componentId withTransitionOptions:(RNNTransitionOptions *)transitionOptions {
 	UIViewController<RNNRootViewProtocol>* vc = (UIViewController<RNNRootViewProtocol>*)[_store findComponentForId:componentId];
 	UINavigationController* nvc = [vc navigationController];
 	if ([nvc topViewController] == vc) {
-		if (animationData) {
+		if (transitionOptions) {
 			RNNRootViewController* RNNVC = (RNNRootViewController*)vc;
 			nvc.delegate = RNNVC;
-			[RNNVC.animator setupTransition:animationData];
+			RNNVC.animator = [[RNNAnimator alloc] initWithTransitionOptions:transitionOptions];
 			[nvc popViewControllerAnimated:vc.isAnimated];
 		} else {
 			nvc.delegate = nil;

lib/ios/RNNRootViewController.h

 @interface RNNRootViewController : UIViewController	<RNNRootViewProtocol>
 
 @property (nonatomic, strong) RNNNavigationOptions* options;
-@property (nonatomic, strong) RNNAnimator* animator;
 @property (nonatomic, strong) RNNEventEmitter *eventEmitter;
 @property (nonatomic, strong) NSString* componentId;
 @property (nonatomic, strong) RNNTopTabsViewController* topTabsViewController;
+@property (nonatomic, strong) RNNAnimator* animator;
 
 -(instancetype)initWithName:(NSString*)name
 				withOptions:(RNNNavigationOptions*)options
 			withComponentId:(NSString*)componentId
 			rootViewCreator:(id<RNNRootViewCreator>)creator
-			   eventEmitter:(RNNEventEmitter*)eventEmitter
-		   animator:(RNNAnimator*)animator;
+			   eventEmitter:(RNNEventEmitter*)eventEmitter;
 
 
 -(void)applyTabBarItem;

lib/ios/RNNRootViewController.m

 				withOptions:(RNNNavigationOptions*)options
 			withComponentId:(NSString*)componentId
 			rootViewCreator:(id<RNNRootViewCreator>)creator
-			   eventEmitter:(RNNEventEmitter*)eventEmitter
-				   animator:(RNNAnimator *)animator {
+			   eventEmitter:(RNNEventEmitter*)eventEmitter {
 	self = [super init];
 	self.componentId = componentId;
 	self.componentName = name;
 	self.options = options;
 	self.eventEmitter = eventEmitter;
-	self.animator = animator;
+	self.animator = [[RNNAnimator alloc] initWithTransitionOptions:self.options.customTransition];
 	self.view = [creator createRootView:self.componentName rootViewId:self.componentId];
 	
 	[[NSNotificationCenter defaultCenter] addObserver:self
 }
 
 -(BOOL)isCustomTransitioned {
-	return self.animator != nil;
+	return self.options.customTransition != nil;
 }
 
 - (BOOL)isAnimated {

lib/ios/RNNTransitionOptions.h

+#import "RNNOptions.h"
+
+@interface RNNTransitionOptions : RNNOptions
+
+@property (nonatomic, strong) NSArray* animations;
+@property (nonatomic, strong) NSNumber* duration;
+@property (nonatomic, strong) NSNumber* springDamping;
+@property (nonatomic, strong) NSNumber* springVelocity;
+
+@end

lib/ios/RNNTransitionOptions.m

+#import "RNNTransitionOptions.h"
+
+#define DEFAULT_DURATION @(0.7)
+#define DEFAULT_SPRING_VELOCITY @(0.8)
+#define DEFAULT_SPRING_DAMPING @(0.85)
+
+@implementation RNNTransitionOptions
+
+- (instancetype)initWithDict:(NSDictionary *)dict {
+	if (!dict[@"animations"]) {
+		return nil;
+	}
+	
+	return [super initWithDict:dict];
+}
+
+- (NSNumber *)duration {
+	return _duration ? _duration : DEFAULT_DURATION;
+}
+
+- (NSNumber *)springVelocity {
+	return _springVelocity ? _springVelocity : DEFAULT_SPRING_VELOCITY;
+}
+
+- (NSNumber *)springDamping {
+	return _springDamping ? _springDamping : DEFAULT_SPRING_DAMPING;
+}
+
+@end

lib/ios/ReactNativeNavigation.xcodeproj/project.pbxproj

 		504AFE751FFFF0540076E904 /* RNNTopTabsOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 504AFE731FFFF0540076E904 /* RNNTopTabsOptions.m */; };
 		504AFE761FFFF1E00076E904 /* RNNNavigationOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = E83BAD691F27362500A9F3DD /* RNNNavigationOptions.h */; };
 		504AFE771FFFF1E20076E904 /* RNNTopBarOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = A7626BFE1FC2FB6700492FB8 /* RNNTopBarOptions.h */; };
+		507E7D57201DDD3000444E6C /* RNNTransitionOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 507E7D55201DDD3000444E6C /* RNNTransitionOptions.h */; };
+		507E7D58201DDD3000444E6C /* RNNTransitionOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 507E7D56201DDD3000444E6C /* RNNTransitionOptions.m */; };
 		507F43C51FF4F17C00D9425B /* RNNTopTabsViewController.h in Headers */ = {isa = PBXBuildFile; fileRef = 507F43C31FF4F17C00D9425B /* RNNTopTabsViewController.h */; };
 		507F43C61FF4F17C00D9425B /* RNNTopTabsViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 507F43C41FF4F17C00D9425B /* RNNTopTabsViewController.m */; };
 		507F43C91FF4F9CC00D9425B /* RNNTopTabOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 507F43C71FF4F9CC00D9425B /* RNNTopTabOptions.h */; };
 		504AFE631FFE53070076E904 /* RNNOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNOptions.m; sourceTree = "<group>"; };
 		504AFE721FFFF0540076E904 /* RNNTopTabsOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTopTabsOptions.h; sourceTree = "<group>"; };
 		504AFE731FFFF0540076E904 /* RNNTopTabsOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTopTabsOptions.m; sourceTree = "<group>"; };
+		507E7D55201DDD3000444E6C /* RNNTransitionOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTransitionOptions.h; sourceTree = "<group>"; };
+		507E7D56201DDD3000444E6C /* RNNTransitionOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTransitionOptions.m; sourceTree = "<group>"; };
 		507F43C31FF4F17C00D9425B /* RNNTopTabsViewController.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTopTabsViewController.h; sourceTree = "<group>"; };
 		507F43C41FF4F17C00D9425B /* RNNTopTabsViewController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTopTabsViewController.m; sourceTree = "<group>"; };
 		507F43C71FF4F9CC00D9425B /* RNNTopTabOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTopTabOptions.h; sourceTree = "<group>"; };
 				50CB3B681FDE911400AA153B /* RNNSideMenuOptions.m */,
 				50A00C35200F84D6000F01A6 /* RNNOverlayOptions.h */,
 				50A00C36200F84D6000F01A6 /* RNNOverlayOptions.m */,
+				507E7D55201DDD3000444E6C /* RNNTransitionOptions.h */,
+				507E7D56201DDD3000444E6C /* RNNTransitionOptions.m */,
 			);
 			name = Options;
 			sourceTree = "<group>";
 				E8A5CD621F49114F00E89D0D /* RNNElement.h in Headers */,
 				504AFE741FFFF0540076E904 /* RNNTopTabsOptions.h in Headers */,
 				E8E5182E1F83A48B000467AC /* RNNTransitionStateHolder.h in Headers */,
+				507E7D57201DDD3000444E6C /* RNNTransitionOptions.h in Headers */,
 				2DCD9195200014A900EDC75D /* RNNBridgeManager.h in Headers */,
 				7B1126A91E2D2B6C00F9B03B /* RNNControllerFactory.h in Headers */,
 				263905D61E4C94970023D7D3 /* RNNSideMenuController.h in Headers */,
 				263905BA1E4C6F440023D7D3 /* RCCDrawerController.m in Sources */,
 				50F5DFC21F407A8C001A00BC /* RNNTabBarController.m in Sources */,
 				263905BC1E4C6F440023D7D3 /* RCCDrawerHelper.m in Sources */,
+				507E7D58201DDD3000444E6C /* RNNTransitionOptions.m in Sources */,
 				2145452A1F4DC85F006E8DA1 /* RCTHelpers.m in Sources */,
 				2DCD9196200014A900EDC75D /* RNNBridgeManager.m in Sources */,
 				263905C11E4C6F440023D7D3 /* SidebarAirbnbAnimation.m in Sources */,

lib/ios/ReactNativeNavigationTests/RNNCommandsHandlerTest.m

 																withOptions:initialOptions
 															withComponentId:@"componentId"
 															rootViewCreator:[[RNNTestRootViewCreator alloc] init]
-															   eventEmitter:nil
-																   animator:nil];
+															   eventEmitter:nil];
 	RNNNavigationController* nav = [[RNNNavigationController alloc] initWithRootViewController:vc];
 	[vc viewWillAppear:false];
 	XCTAssertTrue([vc.navigationItem.title isEqual:@"the title"]);

lib/ios/ReactNativeNavigationTests/RNNNavigationStackManagerTest.m

 
 
 - (void)testPop_removeTopVCFromStore {
-	[self.uut pop:@"vc3" withAnimationData:(NSDictionary*)nil];
+	[self.uut pop:@"vc3" withTransitionOptions:nil];
 	XCTAssertNil([self.store findComponentForId:@"vc3"]);
 	XCTAssertNotNil([self.store findComponentForId:@"vc2"]);
 	XCTAssertNotNil([self.store findComponentForId:@"vc1"]);

lib/ios/ReactNativeNavigationTests/RNNRootViewControllerTest.m

 	self.componentId = @"cntId";
 	self.emitter = nil;
 	self.options = [RNNNavigationOptions new];
-	self.uut = [[RNNRootViewController alloc] initWithName:self.pageName withOptions:self.options withComponentId:self.componentId rootViewCreator:self.creator eventEmitter:self.emitter animator:nil];
+	self.uut = [[RNNRootViewController alloc] initWithName:self.pageName withOptions:self.options withComponentId:self.componentId rootViewCreator:self.creator eventEmitter:self.emitter];
 }
 
 -(void)testTopBarBackgroundColor_validColor{

playground/src/screens/CustomTransitionOrigin.js

     Navigation.push(this.props.componentId, {
       component: {
         name: 'navigation.playground.CustomTransitionDestination',
-        customTransition: {
-          animations: [
-            { type: 'sharedElement', fromId: 'title1', toId: 'title2', startDelay: 0, springVelocity: 0.2, duration: 0.5 },
-            {
-              type: 'sharedElement', fromId: 'image1', toId: 'customDestinationImage', startDelay: 0, springVelocity: 0.9,
-              springDamping: 0.9, duration: 0.8, interactivePop: true
-            },
-            { type: 'sharedElement', fromId: 'image2', toId: 'customDestinationImage2', startDelay: 0, duration: 0.8 },
-            { fromId: 'image4', endY: 50, endX: 50, endAlpha: 0, startDelay: 0, duration: 0.8, springVelocity: 0.5 },
-            { fromId: 'customDestinationParagraph', startY: 50, startAlpha: 0, endAlpha: 1, startDelay: 0, duration: 0.8 }
-
-          ],
-          duration: 0.8
+        options: {
+          customTransition: {
+            animations: [
+              { type: 'sharedElement', fromId: 'title1', toId: 'title2', startDelay: 0, springVelocity: 0.2, duration: 0.5 },
+              { type: 'sharedElement', fromId: 'image1', toId: 'customDestinationImage', startDelay: 0, springVelocity: 0.9,
+              springDamping: 0.9, duration: 0.8, interactivePop: true },
+              { type: 'sharedElement', fromId: 'image2', toId: 'customDestinationImage2', startDelay: 0, duration: 0.8 },
+              { fromId: 'image4', endY: 50, endX: 50, endAlpha: 0, startDelay: 0, duration: 0.8, springVelocity: 0.5 },
+              { fromId: 'customDestinationParagraph', startY: 50, startAlpha: 0, endAlpha: 1, startDelay: 0, duration: 0.8 }
+            ],
+            duration: 0.8
+          }
         }
       }
     });