From 7e7dd5244e8d26485ad7950a89c04c98c4fef83f Mon Sep 17 00:00:00 2001 From: Andrew Date: Mon, 11 Mar 2019 21:00:02 +0400 Subject: Initial commit/ --- frontend/app/config/navigation/transitions.js | 59 +++++++++++++++++++++++++++ 1 file changed, 59 insertions(+) create mode 100644 frontend/app/config/navigation/transitions.js (limited to 'frontend/app/config/navigation/transitions.js') diff --git a/frontend/app/config/navigation/transitions.js b/frontend/app/config/navigation/transitions.js new file mode 100644 index 0000000..ff3d2fa --- /dev/null +++ b/frontend/app/config/navigation/transitions.js @@ -0,0 +1,59 @@ +import { + Dimensions, + Platform, +} from 'react-native'; + +const { width } = Dimensions.get('window'); + +const IosTransition = (index, position) => { + const inputRange = [index - 1, index, index + 0.99, index + 1]; + const outputRange = [width, 0, -10, -10]; + + const translateY = 0; + const translateX = position.interpolate({ + inputRange, + outputRange, + }); + + const opacity = position.interpolate({ + inputRange, + outputRange: [0, 1, 1, 0], + }); + return { + opacity, + transform: [{ translateX }, { translateY }], + }; +}; + +const DroidTransition = (index, position) => { + const inputRange = [index - 1, index, index + 0.99, index + 1]; + + const opacity = position.interpolate({ + inputRange, + outputRange: [0, 1, 1, 0], + }); + + const translateX = 0; + const translateY = position.interpolate({ + inputRange, + outputRange: [50, 0, 0, 0], + }); + + return { + opacity, + transform: [{ translateX }, { translateY }], + }; +}; + +function transition() { + return { + screenInterpolator: (sceneProps) => { + const { position, scene } = sceneProps; + const { index } = scene; + if (Platform.OS === 'ios') { return IosTransition(index, position); } + return DroidTransition(index, position); + }, + }; +} + +export default transition; -- cgit v1.2.3