refactored shared element transitions (#2783)

lib/ios/RNNAnimatedView.h

@@ -1,12 +1,11 @@
 #import <UIKit/UIKit.h>
-#import "RNNTransitionStateHolder.h"
 #import "RNNViewLocation.h"
 #import "VICMAImageView.h"
 
-@class RNNViewLocation;
-@class RNNTransitionStateHolder;
+
 @interface RNNAnimatedView : UIView
 
--(instancetype)initWithTransition:(RNNTransitionStateHolder*)transition andLocation:(RNNViewLocation*)location andIsBackButton:(BOOL)backButton;
+-(instancetype)initFromElement:(RNNElementView*)fromElement toElement:(RNNElementView*)toElement andLocation:(RNNViewLocation*)location andIsBackButton:(BOOL)backButton startAlpha:(CGFloat)startAlpha endAlpha:(CGFloat)endAlpha;
 +(UIViewContentMode)contentModefromString:(NSString*)resizeMode;
+
 @end

lib/ios/RNNAnimatedView.m

@@ -3,30 +3,26 @@
 
 @implementation RNNAnimatedView
 
--(instancetype)initWithTransition:(RNNTransitionStateHolder*)transition andLocation:(RNNViewLocation*)location andIsBackButton:(BOOL)backButton {
+-(instancetype)initFromElement:(RNNElementView*)fromElement toElement:(RNNElementView*)toElement andLocation:(RNNViewLocation*)location andIsBackButton:(BOOL)backButton startAlpha:(CGFloat)startAlpha endAlpha:(CGFloat)endAlpha {
 	UIView* animatedView = nil;
 	if (backButton) {
-		if ([self elementIsImage:transition.fromElement]) {
-			animatedView = [self createImageAnimatedView:animatedView fromElement:transition.fromElement toElement:transition.toElement];
+		if ([self elementIsImage:fromElement]) {
+			animatedView = [self createImageAnimatedView:animatedView fromElement:fromElement toElement:toElement];
 		} else {
-			if (transition.toElement) {
-				animatedView = [[transition.toElement subviews][0] snapshotViewAfterScreenUpdates:NO];
+			if (toElement) {
+				animatedView = [[toElement subviews][0] snapshotViewAfterScreenUpdates:NO];
 			} else {
-				animatedView = [[transition.fromElement subviews][0] snapshotViewAfterScreenUpdates:NO];
+				animatedView = [[fromElement subviews][0] snapshotViewAfterScreenUpdates:NO];
 			}
 		}
-		[self assignStyle:animatedView withSize:location.toSize center:location.toCenter andAlpha:transition.endAlpha];
+		[self assignStyle:animatedView withSize:location.toSize center:location.toCenter andAlpha:endAlpha];
 	} else {
-		if ([self elementIsImage:transition.fromElement]) {
-			animatedView = [self createImageAnimatedView:animatedView fromElement:transition.fromElement toElement:transition.fromElement];
+		if ([self elementIsImage:fromElement]) {
+			animatedView = [self createImageAnimatedView:animatedView fromElement:fromElement toElement:fromElement];
 		} else {
-			if (transition.isFromVC) {
-				animatedView = [[transition.fromElement subviews][0] snapshotViewAfterScreenUpdates:NO];
-			} else {
-				animatedView = [[transition.fromElement subviews][0] snapshotViewAfterScreenUpdates:YES];
-			}
+			animatedView = [[fromElement subviews][0] snapshotViewAfterScreenUpdates:YES];
 		}
-		[self assignStyle:animatedView withSize:location.fromSize center:location.fromCenter andAlpha:transition.startAlpha];
+		[self assignStyle:animatedView withSize:location.fromSize center:location.fromCenter andAlpha:startAlpha];
 	}
 	return (RNNAnimatedView*)animatedView;
 }

lib/ios/RNNTransitionOptions.h → lib/ios/RNNAnimationOptions.h

@@ -1,6 +1,6 @@
 #import "RNNOptions.h"
 
-@interface RNNTransitionOptions : RNNOptions
+@interface RNNAnimationOptions : RNNOptions
 
 @property (nonatomic, strong) NSArray* animations;
 @property (nonatomic, strong) NSNumber* duration;

lib/ios/RNNTransitionOptions.m → lib/ios/RNNAnimationOptions.m

@@ -1,10 +1,10 @@
-#import "RNNTransitionOptions.h"
+#import "RNNAnimationOptions.h"
 
 #define DEFAULT_DURATION @(0.7)
 #define DEFAULT_SPRING_VELOCITY @(0.8)
 #define DEFAULT_SPRING_DAMPING @(0.85)
 
-@implementation RNNTransitionOptions
+@implementation RNNAnimationOptions
 
 - (instancetype)initWithDict:(NSDictionary *)dict {
 	if (!dict[@"animations"]) {

lib/ios/RNNAnimator.h

@@ -1,10 +1,9 @@
 #import <Foundation/Foundation.h>
 #import <UIKit/UIKit.h>
-#import "RNNElementView.h"
-#import "RNNTransitionOptions.h"
+#import "RNNAnimationOptions.h"
 
 @interface RNNAnimator : NSObject <UIViewControllerAnimatedTransitioning>
 
--(instancetype)initWithTransitionOptions:(RNNTransitionOptions *)transitionOptions;
+-(instancetype)initWithTransitionOptions:(RNNAnimationOptions *)transitionOptions;
 
 @end

lib/ios/RNNAnimator.m

@@ -1,16 +1,8 @@
-#import <React/RCTRedBox.h>
 #import "RNNAnimator.h"
-#import "RNNElementView.h"
-#import "RNNInteractivePopAnimator.h"
-#import "VICMAImageView.h"
-#import "RNNTransitionStateHolder.h"
-#import "RNNElementFinder.h"
-#import "RNNViewLocation.h"
-#import "RNNAnimatedView.h"
+#import "RNNTransition.h"
 
 @interface  RNNAnimator()
-@property (nonatomic, strong) RNNTransitionOptions* transitionOptions;
-@property (nonatomic, strong) RNNInteractivePopAnimator* interactivePopAnimator;
+@property (nonatomic, strong) RNNAnimationOptions* transitionOptions;
 @property (nonatomic) BOOL backButton;
 @property (nonatomic, strong) UIViewController* fromVC;
 @property (nonatomic, strong) UIViewController* toVC;
@@ -18,7 +10,7 @@
 
 @implementation RNNAnimator
 
--(instancetype)initWithTransitionOptions:(RNNTransitionOptions *)transitionOptions {
+-(instancetype)initWithTransitionOptions:(RNNAnimationOptions *)transitionOptions {
 	self = [super init];
 	if (transitionOptions) {
 		[self setupTransition:transitionOptions];
@@ -29,7 +21,7 @@
 	return self;
 }
 
--(void)setupTransition:(RNNTransitionOptions *)transitionOptions {
+-(void)setupTransition:(RNNAnimationOptions *)transitionOptions {
 	self.transitionOptions = transitionOptions;
 	if (!transitionOptions.animations) {
 		[[NSException exceptionWithName:NSInvalidArgumentException reason:@"No animations" userInfo:nil] raise];
@@ -38,78 +30,39 @@
 	self.backButton = false;
 }
 
--(NSArray*)prepareSharedElementTransition:(NSArray*)RNNSharedElementsToVC
-						andfromVCElements:(NSArray*)RNNSharedElementsFromVC
-						withComponentView:(UIView*)componentView {
+-(NSArray*)prepareSharedElementTransitionWithComponentView:(UIView*)componentView {
 	NSMutableArray* transitions = [NSMutableArray new];
 	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];
-		RNNViewLocation* animatedViewLocations = [[RNNViewLocation alloc] initWithTransition:transitionStateHolder andVC:self.fromVC];
-		RNNAnimatedView* animatedView = [[RNNAnimatedView alloc] initWithTransition:transitionStateHolder andLocation:animatedViewLocations andIsBackButton:self.backButton];
-		transitionStateHolder.locations = animatedViewLocations;
-		[componentView addSubview:animatedView];
-		[componentView bringSubviewToFront:animatedView];
-		transitionStateHolder.animatedView = animatedView;
-		[transitions addObject:transitionStateHolder];
-		if (transitionStateHolder.isSharedElementTransition) {
-			[transitionStateHolder.toElement setHidden: YES];
-		}
-		[transitionStateHolder.fromElement setHidden:YES];
+		RNNTransition* transition = [[RNNTransition alloc] initFromVC:self.fromVC toVC:self.toVC transitionOptions:transitionStateHolder isBackButton:self.backButton];
+
+		[componentView addSubview:transition.animatedView];
+		[componentView bringSubviewToFront:transition.animatedView];
+		
+		[transitions addObject:transition];
 	}
+	
 	return transitions;
 }
 
 -(void)animateTransitions:(NSArray*)transitions {
-	for (RNNTransitionStateHolder* transition in transitions ) {
-		[UIView animateWithDuration:transition.duration delay:transition.startDelay usingSpringWithDamping:transition.springDamping initialSpringVelocity:transition.springVelocity options:UIViewAnimationOptionCurveEaseOut  animations:^{
-			RNNAnimatedView* animatedView = transition.animatedView;
-			if (!self.backButton) {
-				[self setAnimatedViewFinalProperties:animatedView toElement:transition.toElement fromElement:transition.fromElement isSharedElementTransition:transition.isSharedElementTransition withTransform:transition.locations.transform withCenter:transition.locations.toCenter andAlpha:transition.endAlpha];
-			} else {
-				[self setAnimatedViewFinalProperties:animatedView toElement:transition.fromElement fromElement:transition.fromElement isSharedElementTransition:transition.isSharedElementTransition withTransform:transition.locations.transformBack withCenter:transition.locations.fromCenter andAlpha:transition.startAlpha];
-			}
+	for (RNNTransition* transition in transitions ) {
+		[UIView animateWithDuration:transition.options.duration delay:transition.options.startDelay usingSpringWithDamping:transition.options.springDamping initialSpringVelocity:transition.options.springVelocity options:UIViewAnimationOptionCurveEaseOut  animations:^{
+			[transition setAnimatedViewFinalProperties];
 		} completion:^(BOOL finished) {
 
 		}];
 	}
 }
 
--(void)setAnimatedViewFinalProperties:(RNNAnimatedView*)animatedView toElement:(RNNElementView*)toElement fromElement:(RNNElementView*)fromElement isSharedElementTransition:(BOOL)isShared withTransform:(CGAffineTransform)transform withCenter:(CGPoint)center andAlpha:(double)alpha {
-	animatedView.alpha = alpha;
-	animatedView.center = center;
-	animatedView.transform = transform;
-	if (isShared) {
-		if ([[fromElement subviews][0] isKindOfClass:[UIImageView class]]) {
-			animatedView.contentMode = UIViewContentModeScaleAspectFill;
-			if ([toElement resizeMode]){
-				animatedView.contentMode = [RNNAnimatedView contentModefromString:[toElement resizeMode]];
-			}
-		}
-	}
-}
-
-
--(void)animateComplition:(NSArray*)transitions fromVCSnapshot:(UIView*)fromSnapshot andTransitioningContext:(id<UIViewControllerContextTransitioning>)transitionContext {
+-(void)animateCompletion:(NSArray*)transitions fromVCSnapshot:(UIView*)fromSnapshot andTransitioningContext:(id<UIViewControllerContextTransitioning>)transitionContext {
 	[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 ) {
-					[transition.fromElement setHidden:NO];
-					if (transition.isSharedElementTransition) {
-						[transition.toElement setHidden:NO];
-					}
-					RNNAnimatedView* animtedView = transition.animatedView;
-					[animtedView removeFromSuperview];
-					
-					if (transition.interactivePop) {
-						self.interactivePopAnimator = [[RNNInteractivePopAnimator alloc] initWithTopView:transition.toElement andBottomView:transition.fromElement andOriginFrame:transition.locations.fromFrame andViewController:self.toVC];
-						UIPanGestureRecognizer* gesture = [[UIPanGestureRecognizer alloc] initWithTarget:self.interactivePopAnimator
-																								  action:@selector(handleGesture:)];
-						[transition.toElement addGestureRecognizer:gesture];
-					}
+				for (RNNTransition* transition in transitions ) {
+					[transition transitionCompleted];
 				}
+				
 				[fromSnapshot removeFromSuperview];
 				if (![transitionContext transitionWasCancelled]) {
 					self.toVC.view.alpha = 1;
@@ -135,10 +88,9 @@
 	[componentView addSubview:fromSnapshot];
 	[componentView addSubview:toVC.view];
 	toVC.view.alpha = 0;
-	NSArray* onlyForTesting = @[];
-	NSArray* onlyForTesting2 = @[];
-	NSArray* transitions = [self prepareSharedElementTransition:onlyForTesting andfromVCElements:onlyForTesting2 withComponentView:componentView];
-	[self animateComplition:transitions fromVCSnapshot:fromSnapshot andTransitioningContext:transitionContext];
+	
+	NSArray* transitions = [self prepareSharedElementTransitionWithComponentView:componentView];
+	[self animateCompletion:transitions fromVCSnapshot:fromSnapshot andTransitioningContext:transitionContext];
 	[self animateTransitions:transitions];
 }
 

lib/ios/RNNCommandsHandler.m

@@ -77,7 +77,7 @@
 	}];
 	
 	NSDictionary* animationData = options[@"customTransition"];
-	RNNTransitionOptions* transitionOptions = [[RNNTransitionOptions alloc] initWithDict:animationData];
+	RNNAnimationOptions* transitionOptions = [[RNNAnimationOptions alloc] initWithDict:animationData];
 	
 	if (transitionOptions){
 		if (transitionOptions.animations) {

lib/ios/RNNElementFinder.h

@@ -1,14 +1,10 @@
 #import <Foundation/Foundation.h>
 #import "RNNElementView.h"
-#import "RNNTransitionStateHolder.h"
 
 @interface RNNElementFinder : NSObject
 
-@property (nonatomic, strong) NSArray* toVCTransitionElements;
-@property (nonatomic, strong) NSArray* fromVCTransitionElements;
+- (instancetype)initWithToVC:(UIViewController *)toVC andfromVC:(UIViewController *)fromVC;
+
+- (RNNElementView *)findElementForId:(NSString *)elementId;
 
--(instancetype)initWithToVC:(UIViewController*)toVC andfromVC:(UIViewController*)fromVC;
--(NSArray*)findRNNElementViews:(UIView*)view;
--(RNNElementView*)findViewToAnimate:(NSArray*)RNNTransitionElementViews withId:(NSString*)elementId;
--(void)findElementsInTransition:(RNNTransitionStateHolder*)transitionStateHolder;
 @end

lib/ios/RNNElementFinder.m

@@ -1,15 +1,24 @@
 #import "RNNElementFinder.h"
 
+@interface RNNElementFinder ()
+
+@property (nonatomic, strong) NSArray* toVCTransitionElements;
+@property (nonatomic, strong) NSArray* fromVCTransitionElements;
+
+@end
+
 @implementation RNNElementFinder 
 
--(instancetype)initWithToVC:(UIViewController*)toVC andfromVC:(UIViewController*)fromVC {
+- (instancetype)initWithToVC:(UIViewController *)toVC andfromVC:(UIViewController *)fromVC {
 	self = [super init];
+	
 	self.toVCTransitionElements = [self findRNNElementViews:toVC.view];
 	self.fromVCTransitionElements = [self findRNNElementViews:fromVC.view];
+	
 	return self;
 }
 
--(RNNElementView*)findViewToAnimate:(NSArray*)RNNTransitionElementViews withId:(NSString*)elementId{
+- (RNNElementView *)findViewToAnimate:(NSArray *)RNNTransitionElementViews withId:(NSString *)elementId{
 	for (RNNElementView* view in RNNTransitionElementViews) {
 		if ([view.elementId isEqualToString:elementId]){
 			return view;
@@ -18,10 +27,10 @@
 	return nil;
 }
 
--(NSArray*)findRNNElementViews:(UIView*)view{
+- (NSArray *)findRNNElementViews:(UIView*)view {
 	NSMutableArray* elementViews = [NSMutableArray new];
-	for(UIView *aView in view.subviews){
-		if([aView isMemberOfClass:[RNNElementView class]]){
+	for (UIView *aView in view.subviews) {
+		if([aView isMemberOfClass:[RNNElementView class]]) {
 			[elementViews addObject:aView];
 		} else{
 			if ([aView subviews]) {
@@ -29,28 +38,22 @@
 			}
 		}
 	}
+	
 	return elementViews;
 }
 
--(void)findElementsInTransition:(RNNTransitionStateHolder*)transitionStateHolder {
-	if ([self findViewToAnimate:self.toVCTransitionElements withId:transitionStateHolder.fromId]) {
-		transitionStateHolder.fromElement = [self findViewToAnimate:self.toVCTransitionElements withId:transitionStateHolder.fromId];
-		transitionStateHolder.isFromVC = false;
-	} else if ([self findViewToAnimate:self.fromVCTransitionElements withId:transitionStateHolder.fromId]){
-		transitionStateHolder.fromElement = [self findViewToAnimate:self.fromVCTransitionElements withId:transitionStateHolder.fromId];
-		transitionStateHolder.isFromVC = true;
-	} else {
-		[[NSException exceptionWithName:NSInvalidArgumentException reason:[NSString stringWithFormat:@"elementId %@ does not exist", transitionStateHolder.fromId] userInfo:nil] raise];
-	}
-	if (transitionStateHolder.toId) {
-		if ([self findViewToAnimate:self.toVCTransitionElements withId:transitionStateHolder.toId]) {
-			transitionStateHolder.toElement = [self findViewToAnimate:self.toVCTransitionElements withId:transitionStateHolder.toId];
-		} else if ([self findViewToAnimate:self.fromVCTransitionElements withId:transitionStateHolder.toId]){
-			transitionStateHolder.toElement = [self findViewToAnimate:self.fromVCTransitionElements withId:transitionStateHolder.toId];
+- (RNNElementView *)findElementForId:(NSString *)elementId {
+	if (elementId) {
+		if ([self findViewToAnimate:self.toVCTransitionElements withId:elementId]) {
+			return [self findViewToAnimate:self.toVCTransitionElements withId:elementId];
+		} else if ([self findViewToAnimate:self.fromVCTransitionElements withId:elementId]){
+			return [self findViewToAnimate:self.fromVCTransitionElements withId:elementId];
 		} else {
-			[[NSException exceptionWithName:NSInvalidArgumentException reason:[NSString stringWithFormat:@"elementId %@ does not exist", transitionStateHolder.toId] userInfo:nil] raise];
+			[[NSException exceptionWithName:NSInvalidArgumentException reason:[NSString stringWithFormat:@"elementId %@ does not exist", elementId] userInfo:nil] raise];
 		}
 	}
+	
+	return nil;
 }
 
 @end

lib/ios/RNNNavigationOptions.h

@@ -6,7 +6,7 @@
 #import "RNNTopTabOptions.h"
 #import "RNNTopTabsOptions.h"
 #import "RNNOverlayOptions.h"
-#import "RNNTransitionOptions.h"
+#import "RNNAnimationOptions.h"
 
 extern const NSInteger BLUR_STATUS_TAG;
 extern const NSInteger BLUR_TOPBAR_TAG;
@@ -21,7 +21,7 @@ extern const NSInteger TOP_BAR_TRANSPARENT_TAG;
 @property (nonatomic, strong) RNNTopTabOptions* topTab;
 @property (nonatomic, strong) RNNSideMenuOptions* sideMenu;
 @property (nonatomic, strong) RNNOverlayOptions* overlay;
-@property (nonatomic, strong) RNNTransitionOptions* customTransition;
+@property (nonatomic, strong) RNNAnimationOptions* customTransition;
 
 @property (nonatomic, strong) RNNNavigationOptions* defaultOptions;
 

lib/ios/RNNNavigationOptions.m

@@ -32,7 +32,7 @@ const NSInteger TOP_BAR_TRANSPARENT_TAG = 78264803;
 	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"]];
+	self.customTransition = [[RNNAnimationOptions alloc] initWithDict:[options objectForKey:@"customTransition"]];
 	
 	return self;
 }

lib/ios/RNNNavigationStackManager.h

@@ -11,7 +11,7 @@
 
 
 -(void)push:(UIViewController<RNNRootViewProtocol>*)newTop onTop:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
--(void)pop:(NSString*)componentId withTransitionOptions:(RNNTransitionOptions*)transitionOptions;
+-(void)pop:(NSString*)componentId withTransitionOptions:(RNNAnimationOptions*)transitionOptions;
 -(void)popTo:(NSString*)componentId;
 -(void)popToRoot:(NSString*)componentId;
 

lib/ios/RNNNavigationStackManager.m

@@ -60,7 +60,7 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 	self.fromVC = nil;
 }
 
--(void)pop:(NSString *)componentId withTransitionOptions:(RNNTransitionOptions *)transitionOptions {
+-(void)pop:(NSString *)componentId withTransitionOptions:(RNNAnimationOptions *)transitionOptions {
 	UIViewController<RNNRootViewProtocol>* vc = (UIViewController<RNNRootViewProtocol>*)[_store findComponentForId:componentId];
 	UINavigationController* nvc = [vc navigationController];
 	if ([nvc topViewController] == vc) {

lib/ios/RNNTransition.h

@@ -0,0 +1,16 @@
+#import <Foundation/Foundation.h>
+#import "RNNTransitionStateHolder.h"
+#import "RNNAnimatedView.h"
+
+@interface RNNTransition : NSObject
+
+@property (nonatomic, strong) RNNAnimatedView* animatedView;
+@property (nonatomic, strong) RNNTransitionStateHolder* options;
+
+- (instancetype)initFromVC:(UIViewController*)fromVC toVC:(UIViewController*)toVC transitionOptions:(RNNTransitionStateHolder*)transitionOptions isBackButton:(BOOL)isBackButton;
+
+- (void)setAnimatedViewFinalProperties;
+
+- (void)transitionCompleted;
+
+@end

lib/ios/RNNTransition.m

@@ -0,0 +1,86 @@
+#import "RNNTransition.h"
+#import "RNNElementFinder.h"
+#import "RNNTransitionStateHolder.h"
+#import "RNNViewLocation.h"
+#import "RNNInteractivePopAnimator.h"
+
+@interface RNNTransition () {
+	UIViewController* _toVC;
+	UIViewController* _fromVC;
+	BOOL _isBackButton;
+}
+
+@property (nonatomic, strong) RNNElementView* fromElement;
+@property (nonatomic, strong) RNNElementView* toElement;
+@property (nonatomic, strong) RNNViewLocation* locations;
+
+@end
+
+@implementation RNNTransition
+
+- (instancetype)initFromVC:(UIViewController *)fromVC toVC:(UIViewController *)toVC transitionOptions:(RNNTransitionStateHolder *)transitionOptions isBackButton:(BOOL)isBackButton {
+	self = [super init];
+	
+	_toVC = toVC;
+	_fromVC = fromVC;
+	_isBackButton = isBackButton;
+	
+	self.options = transitionOptions;
+	
+	RNNElementFinder* elementFinder = [[RNNElementFinder alloc] initWithToVC:toVC andfromVC:fromVC];
+	self.fromElement = [elementFinder findElementForId:self.options.fromId];
+	self.toElement = [elementFinder findElementForId:transitionOptions.toId];
+	self.locations = [[RNNViewLocation alloc] initWithFromElement:self.fromElement toElement:self.toElement startPoint:CGPointMake(self.options.startX, self.options.startY) endPoint:CGPointMake(self.options.endX, self.options.endY) andVC:fromVC];
+	
+	self.animatedView = [[RNNAnimatedView alloc] initFromElement:self.fromElement toElement:self.toElement andLocation:self.locations andIsBackButton:isBackButton startAlpha:self.options.startAlpha endAlpha:self.options.endAlpha];
+	
+	if (transitionOptions.isSharedElementTransition) {
+		[self.toElement setHidden: YES];
+	}
+	
+	[self.fromElement setHidden:YES];
+	
+	return self;
+}
+
+- (void)setAnimatedViewFinalProperties {
+	CGFloat alpha = _isBackButton ? self.options.startAlpha : self.options.endAlpha;
+	self.animatedView.alpha = alpha;
+	
+	CGPoint center = _isBackButton ? self.locations.fromCenter : self.locations.toCenter;
+	self.animatedView.center = center;
+	
+	CGAffineTransform transform = _isBackButton ? self.locations.transformBack : self.locations.transform;
+	self.animatedView.transform = transform;
+	
+	RNNElementView* fromElement = _isBackButton ? self.toElement : self.fromElement;
+	RNNElementView* toElement = _isBackButton ? self.fromElement : self.toElement;
+	
+	if (self.options.isSharedElementTransition) {
+		if ([[fromElement subviews][0] isKindOfClass:[UIImageView class]]) {
+			self.animatedView.contentMode = UIViewContentModeScaleAspectFill;
+			if ([toElement resizeMode]){
+				self.animatedView.contentMode = [RNNAnimatedView contentModefromString:[toElement resizeMode]];
+			}
+		}
+	}
+}
+
+
+- (void)transitionCompleted {
+	[self.fromElement setHidden:NO];
+	if (self.options.isSharedElementTransition) {
+		[self.toElement setHidden:NO];
+	}
+	
+	[self.animatedView removeFromSuperview];
+	
+	if (self.options.interactivePop) {
+		RNNInteractivePopAnimator* interactivePopAnimator = [[RNNInteractivePopAnimator alloc] initWithTopView:self.toElement andBottomView:self.fromElement andOriginFrame:self.locations.fromFrame andViewController:_toVC];
+		UIPanGestureRecognizer* gesture = [[UIPanGestureRecognizer alloc] initWithTarget:interactivePopAnimator
+																				  action:@selector(handleGesture:)];
+		[self.toElement addGestureRecognizer:gesture];
+	}
+}
+
+@end

lib/ios/RNNTransitionStateHolder.h

@@ -1,10 +1,5 @@
 #import <Foundation/Foundation.h>
-#import "RNNElementView.h"
-#import "RNNViewLocation.h"
-#import "RNNAnimatedView.h"
 
-@class RNNAnimatedView;
-@class RNNViewLocation;
 @interface RNNTransitionStateHolder : NSObject
 
 @property (nonatomic) double startAlpha;
@@ -14,20 +9,15 @@
 @property (nonatomic) double springVelocity;
 @property (nonatomic) double springDamping;
 @property (nonatomic) double startDelay;
-@property (nonatomic, strong) RNNElementView* fromElement;
 @property (nonatomic, strong) NSString* fromElementType;
-@property (nonatomic) UIViewContentMode fromElementResizeMode;
-@property (nonatomic, strong) RNNElementView* toElement;
 @property (nonatomic, strong) NSString* fromId;
 @property (nonatomic, strong) NSString* toId;
-@property (nonatomic, strong) RNNAnimatedView* animatedView;
 @property (nonatomic) BOOL isSharedElementTransition;
-@property (nonatomic, strong) RNNViewLocation* locations;
-@property (nonatomic) BOOL isFromVC;
 @property (nonatomic) double startY;
 @property (nonatomic) double endY;
 @property (nonatomic) double startX;
 @property (nonatomic) double endX;
 
--(instancetype)initWithTransition:(NSDictionary*)transition;
+- (instancetype)initWithTransition:(NSDictionary*)transition;
+
 @end

lib/ios/RNNTransitionStateHolder.m

@@ -1,6 +1,5 @@
 #import "RNNTransitionStateHolder.h"
 #import "RNNUtils.h"
-#import "RNNElementFinder.h"
 
 @implementation RNNTransitionStateHolder
 
@@ -19,12 +18,7 @@
 	self.endY = [RNNUtils getDoubleOrKey:transition[@"y"] withKey:@"to" withDefault:0];
 	self.fromId = [transition objectForKey:@"fromId"];
 	self.toId = [transition objectForKey:@"toId"];
-	self.fromElement = nil;
 	self.fromElementType = nil;
-	self.fromElementResizeMode = UIViewContentModeScaleAspectFill;
-	self.toElement = nil;
-	self.animatedView = nil;
-	self.locations  = nil; 
 	self.isSharedElementTransition = [[transition objectForKey:@"type"] isEqualToString:@"sharedElement"];
 	return self;
 }

lib/ios/RNNViewLocation.h

@@ -1,17 +1,8 @@
-//
-//  RNNViewLocation.h
-//  ReactNativeNavigation
-//
-//  Created by Elad Bogomolny on 03/10/2017.
-//  Copyright © 2017 Wix. All rights reserved.
-//
-
 #import <Foundation/Foundation.h>
-#import <UIKit/UIKit.h>
-#import "RNNTransitionStateHolder.h"
+#import "RNNElementView.h"
 
-@class RNNTransitionStateHolder;
 @interface RNNViewLocation : NSObject
+
 @property (nonatomic) CGRect fromFrame;
 @property (nonatomic) CGPoint fromCenter;
 @property (nonatomic) CGSize fromSize;
@@ -21,7 +12,10 @@
 @property (nonatomic) CGAffineTransform transform;
 @property (nonatomic) CGAffineTransform transformBack;
 
--(instancetype)initWithTransition:(RNNTransitionStateHolder*)transition andVC:(UIViewController*)vc;
+-(instancetype)initWithFromElement:(RNNElementView*)fromElement toElement:(RNNElementView*)toElement startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint andVC:(UIViewController*)vc;
+
 -(CGRect)frameFromSuperViewController:(UIView*)view andVC:(UIViewController*)vc;
+
 -(CGPoint)centerFromSuperViewController:(UIView*)view andVC:(UIViewController*)vc;
+
 @end

lib/ios/RNNViewLocation.m

@@ -1,43 +1,47 @@
 #import "RNNViewLocation.h"
 
 @implementation RNNViewLocation
--(instancetype)initWithTransition:(RNNTransitionStateHolder*)transition andVC:(UIViewController*)vc {
+
+- (instancetype)initWithFromElement:(RNNElementView *)fromElement toElement:(RNNElementView *)toElement startPoint:(CGPoint)startPoint endPoint:(CGPoint)endPoint andVC:(UIViewController *)vc {
 	self = [super init];
-	self.fromFrame = [self frameFromSuperViewController:[transition.fromElement subviews][0] andVC:vc];
+	
+	self.fromFrame = [self frameFromSuperViewController:[fromElement subviews][0] andVC:vc];
 	CGSize fromSize = self.fromFrame.size;
-	CGPoint fromCenter = [self centerFromSuperViewController:[transition.fromElement subviews][0] andVC:vc];
-	fromCenter.x = fromCenter.x + transition.startX;
-	fromCenter.y = fromCenter.y + transition.startY;
+	CGPoint fromCenter = [self centerFromSuperViewController:[fromElement subviews][0] andVC:vc];
+	fromCenter.x = fromCenter.x + startPoint.x;
+	fromCenter.y = fromCenter.y + startPoint.y;
 	self.fromCenter = fromCenter;
-	CGRect toFrame = [self frameFromSuperViewController:[transition.fromElement subviews][0] andVC:vc];
+	CGRect toFrame = [self frameFromSuperViewController:[fromElement subviews][0] andVC:vc];
 	CGSize toSize = self.fromFrame.size;
-	CGPoint toCenter = [self centerFromSuperViewController:[transition.fromElement subviews][0] andVC:vc];
-	if (transition.toElement) {
-	   toFrame = [self frameFromSuperViewController:[transition.toElement subviews][0] andVC:vc];
+	CGPoint toCenter = [self centerFromSuperViewController:[fromElement subviews][0] andVC:vc];
+	if (toElement) {
+	   toFrame = [self frameFromSuperViewController:[toElement subviews][0] andVC:vc];
 		toSize = toFrame.size;
-		toCenter = [self centerFromSuperViewController:[transition.toElement subviews][0] andVC:vc];
+		toCenter = [self centerFromSuperViewController:[toElement subviews][0] andVC:vc];
 	}
-	toCenter.x = toCenter.x + transition.endX;
-	toCenter.y = toCenter.y + transition.endY;
+	toCenter.x = toCenter.x + endPoint.x;
+	toCenter.y = toCenter.y + endPoint.y;
 	
 	CGAffineTransform transform = CGAffineTransformMakeScale(toSize.width/fromSize.width ,toSize.height/fromSize.height);
 	CGAffineTransform transformBack = CGAffineTransformMakeScale(fromSize.width/toSize.width ,fromSize.height/toSize.height);
+	
 	self.toFrame = toFrame;
 	self.fromSize = fromSize;
 	self.toSize = toSize;
 	self.toCenter = toCenter;
 	self.transform = transform;
 	self.transformBack = transformBack;
+	
 	return self;
 }
 
--(CGRect)frameFromSuperViewController:(UIView*)view andVC:(UIViewController*)vc{
+- (CGRect)frameFromSuperViewController:(UIView *)view andVC:(UIViewController *)vc{
 	CGPoint sharedViewFrameOrigin = [view.superview convertPoint:view.frame.origin toView:vc.view];
 	CGRect originRect = CGRectMake(sharedViewFrameOrigin.x, sharedViewFrameOrigin.y, view.frame.size.width, view.frame.size.height);
 	return originRect;
 }
 
--(CGPoint)centerFromSuperViewController:(UIView*)view andVC:(UIViewController*)vc{
+- (CGPoint)centerFromSuperViewController:(UIView *)view andVC:(UIViewController *)vc{
 	CGPoint sharedViewFrameOrigin = [view.superview convertPoint:view.frame.origin toView:vc.view];
 	CGRect originRect = CGRectMake(sharedViewFrameOrigin.x, sharedViewFrameOrigin.y, view.frame.size.width, view.frame.size.height);
 	CGFloat x = originRect.origin.x + view.frame.size.width/2;

lib/ios/ReactNativeNavigation.xcodeproj/project.pbxproj

@@ -67,14 +67,16 @@
 		5032774F2015E86D00ECD75D /* RNNNavigationEvent.m in Sources */ = {isa = PBXBuildFile; fileRef = 5032774D2015E86D00ECD75D /* RNNNavigationEvent.m */; };
 		503277602016302900ECD75D /* RNNComponentLifecycleEvent.h in Headers */ = {isa = PBXBuildFile; fileRef = 5032775E2016302900ECD75D /* RNNComponentLifecycleEvent.h */; };
 		503277612016302900ECD75D /* RNNComponentLifecycleEvent.m in Sources */ = {isa = PBXBuildFile; fileRef = 5032775F2016302900ECD75D /* RNNComponentLifecycleEvent.m */; };
+		50451D0D2042F70900695F00 /* RNNTransition.h in Headers */ = {isa = PBXBuildFile; fileRef = 50451D0B2042F70900695F00 /* RNNTransition.h */; };
+		50451D0E2042F70900695F00 /* RNNTransition.m in Sources */ = {isa = PBXBuildFile; fileRef = 50451D0C2042F70900695F00 /* RNNTransition.m */; };
 		504AFE641FFE53070076E904 /* RNNOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 504AFE621FFE53070076E904 /* RNNOptions.h */; };
 		504AFE651FFE53070076E904 /* RNNOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 504AFE631FFE53070076E904 /* RNNOptions.m */; };
 		504AFE741FFFF0540076E904 /* RNNTopTabsOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 504AFE721FFFF0540076E904 /* RNNTopTabsOptions.h */; };
 		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 */; };
+		507E7D57201DDD3000444E6C /* RNNAnimationOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */; };
+		507E7D58201DDD3000444E6C /* RNNAnimationOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 507E7D56201DDD3000444E6C /* RNNAnimationOptions.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 */; };
@@ -246,12 +248,14 @@
 		5032774D2015E86D00ECD75D /* RNNNavigationEvent.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNNavigationEvent.m; sourceTree = "<group>"; };
 		5032775E2016302900ECD75D /* RNNComponentLifecycleEvent.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNComponentLifecycleEvent.h; sourceTree = "<group>"; };
 		5032775F2016302900ECD75D /* RNNComponentLifecycleEvent.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNComponentLifecycleEvent.m; sourceTree = "<group>"; };
+		50451D0B2042F70900695F00 /* RNNTransition.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTransition.h; sourceTree = "<group>"; };
+		50451D0C2042F70900695F00 /* RNNTransition.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTransition.m; sourceTree = "<group>"; };
 		504AFE621FFE53070076E904 /* RNNOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNOptions.h; sourceTree = "<group>"; };
 		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>"; };
+		507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNAnimationOptions.h; sourceTree = "<group>"; };
+		507E7D56201DDD3000444E6C /* RNNAnimationOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNAnimationOptions.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>"; };
@@ -477,8 +481,8 @@
 				50CB3B681FDE911400AA153B /* RNNSideMenuOptions.m */,
 				50A00C35200F84D6000F01A6 /* RNNOverlayOptions.h */,
 				50A00C36200F84D6000F01A6 /* RNNOverlayOptions.m */,
-				507E7D55201DDD3000444E6C /* RNNTransitionOptions.h */,
-				507E7D56201DDD3000444E6C /* RNNTransitionOptions.m */,
+				507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */,
+				507E7D56201DDD3000444E6C /* RNNAnimationOptions.m */,
 			);
 			name = Options;
 			sourceTree = "<group>";
@@ -650,6 +654,8 @@
 				E8AEDB491F5C0BAF000F5A6A /* RNNInteractivePopAnimator.m */,
 				E8E5182C1F83A48B000467AC /* RNNTransitionStateHolder.h */,
 				E8E5182D1F83A48B000467AC /* RNNTransitionStateHolder.m */,
+				50451D0B2042F70900695F00 /* RNNTransition.h */,
+				50451D0C2042F70900695F00 /* RNNTransition.m */,
 				E8E518341F83B94A000467AC /* RNNViewLocation.h */,
 				E8E518351F83B94A000467AC /* RNNViewLocation.m */,
 				E8DA243E1F97459B00CD552B /* RNNElementFinder.h */,
@@ -736,7 +742,7 @@
 				E8A5CD621F49114F00E89D0D /* RNNElement.h in Headers */,
 				504AFE741FFFF0540076E904 /* RNNTopTabsOptions.h in Headers */,
 				E8E5182E1F83A48B000467AC /* RNNTransitionStateHolder.h in Headers */,
-				507E7D57201DDD3000444E6C /* RNNTransitionOptions.h in Headers */,
+				507E7D57201DDD3000444E6C /* RNNAnimationOptions.h in Headers */,
 				2DCD9195200014A900EDC75D /* RNNBridgeManager.h in Headers */,
 				7B1126A91E2D2B6C00F9B03B /* RNNControllerFactory.h in Headers */,
 				263905D61E4C94970023D7D3 /* RNNSideMenuController.h in Headers */,
@@ -744,6 +750,7 @@
 				7BEF0D1C1E43771B003E96B0 /* RNNLayoutNode.h in Headers */,
 				507F43C91FF4F9CC00D9425B /* RNNTopTabOptions.h in Headers */,
 				E8A5CD521F464F0400E89D0D /* RNNAnimator.h in Headers */,
+				50451D0D2042F70900695F00 /* RNNTransition.h in Headers */,
 				507F43F81FF525B500D9425B /* RNNSegmentedControl.h in Headers */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
@@ -858,6 +865,7 @@
 				263905C71E4C6F440023D7D3 /* SidebarFeedlyAnimation.m in Sources */,
 				263905B41E4C6F440023D7D3 /* MMDrawerVisualState.m in Sources */,
 				263905C51E4C6F440023D7D3 /* SidebarFacebookAnimation.m in Sources */,
+				50451D0E2042F70900695F00 /* RNNTransition.m in Sources */,
 				7BEF0D191E437684003E96B0 /* RNNRootViewController.m in Sources */,
 				263905C31E4C6F440023D7D3 /* SidebarAnimation.m in Sources */,
 				E8A5CD531F464F0400E89D0D /* RNNAnimator.m in Sources */,
@@ -885,7 +893,7 @@
 				263905BA1E4C6F440023D7D3 /* RCCDrawerController.m in Sources */,
 				50F5DFC21F407A8C001A00BC /* RNNTabBarController.m in Sources */,
 				263905BC1E4C6F440023D7D3 /* RCCDrawerHelper.m in Sources */,
-				507E7D58201DDD3000444E6C /* RNNTransitionOptions.m in Sources */,
+				507E7D58201DDD3000444E6C /* RNNAnimationOptions.m in Sources */,
 				2145452A1F4DC85F006E8DA1 /* RCTHelpers.m in Sources */,
 				2DCD9196200014A900EDC75D /* RNNBridgeManager.m in Sources */,
 				263905C11E4C6F440023D7D3 /* SidebarAirbnbAnimation.m in Sources */,