Tweak the wipe animation to be more accurate

react-navigation · May 24, 2019 · 5cfceef · 5cfceef
1 parent 58901b2
commit 5cfceef
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 16 deletions.
diff --git a/src/TransitionConfigs/TransitionPresets.tsx b/src/TransitionConfigs/TransitionPresets.tsx
@@ -7,8 +7,7 @@ import {
 import { forUIKit, forNoAnimation } from './HeaderStyleInterpolators';
 import {
   TransitionSpecIOS,
-  WipeInFromBottomAndroidSpec,
-  WipeOutToBottomAndroidSpec,
+  WipeFromBottomAndroidSpec,
   FadeOutToBottomAndroidSpec,
   FadeInFromBottomAndroidSpec,
 } from './TransitionSpecs';
@@ -58,8 +57,8 @@ export const WipeFromBottomAndroid: TransitionPreset = {
   direction: 'vertical',
   headerMode: 'screen',
   transitionSpec: {
-    open: WipeInFromBottomAndroidSpec,
-    close: WipeOutToBottomAndroidSpec,
+    open: WipeFromBottomAndroidSpec,
+    close: WipeFromBottomAndroidSpec,
   },
   cardStyleInterpolator: forWipeFromBottomAndroid,
   headerStyleInterpolator: forNoAnimation,

diff --git a/src/TransitionConfigs/TransitionSpecs.tsx b/src/TransitionConfigs/TransitionSpecs.tsx
@@ -1,7 +1,7 @@
 import { Easing } from 'react-native-reanimated';
 import { TransitionSpec } from '../types';
 
-export const TransitionSpecIOS: TransitionSpec = {
+export const TransitionIOSSpec: TransitionSpec = {
   timing: 'spring',
   config: {
     stiffness: 1000,
@@ -32,19 +32,12 @@ export const FadeOutToBottomAndroidSpec: TransitionSpec = {
 };
 
 // See http://androidxref.com/9.0.0_r3/xref/frameworks/base/core/res/res/anim/activity_open_enter.xml
-export const WipeInFromBottomAndroidSpec: TransitionSpec = {
+export const WipeFromBottomAndroidSpec: TransitionSpec = {
   timing: 'timing',
   config: {
     duration: 425,
-    easing: Easing.bezier(0.4, 0, 0.2, 1),
-  },
-};
-
-// See http://androidxref.com/9.0.0_r3/xref/frameworks/base/core/res/res/anim/activity_close_exit.xml
-export const WipeOutToBottomAndroidSpec: TransitionSpec = {
-  timing: 'timing',
-  config: {
-    duration: 425,
-    easing: Easing.bezier(0.4, 0, 0.2, 1),
+    // This is super rough approximation of the path used for the curve by android
+    // See http://androidxref.com/9.0.0_r3/xref/frameworks/base/core/res/res/interpolator/fast_out_extra_slow_in.xml
+    easing: Easing.bezier(0.35, 0.45, 0, 1),
   },
 };