Initial commit

packages/animated-switch/index.js

@@ -0,0 +1,52 @@
+import * as React from 'react';
+import { createNavigator, SceneView, SwitchRouter } from 'react-navigation';
+import { Transitioning, Transition } from 'react-native-reanimated';
+
+const DEFAULT_TRANSITION = (
+  <Transition.Together>
+    <Transition.Out type="fade" durationMs={200} interpolation="easeIn" />
+    <Transition.In type="fade" durationMs={200} />
+  </Transition.Together>
+);
+
+class SwitchView extends React.Component {
+  containerRef = React.createRef();
+
+  componentDidUpdate() {
+    this.containerRef.current &&
+      this.containerRef.current.animateNextTransition();
+  }
+
+  render() {
+    const { state } = this.props.navigation;
+    const activeKey = state.routes[state.index].key;
+    const descriptor = this.props.descriptors[activeKey];
+    const ChildComponent = descriptor.getComponent();
+
+    const transition =
+      this.props.navigationConfig.transition || DEFAULT_TRANSITION;
+
+    return (
+      <Transitioning.View
+        ref={this.containerRef}
+        transition={transition}
+        style={{ flex: 1 }}
+      >
+        <SceneView
+          component={ChildComponent}
+          navigation={descriptor.navigation}
+          screenProps={this.props.screenProps}
+        />
+      </Transitioning.View>
+    );
+  }
+}
+
+export default function createAnimatedSwitchNavigator(
+  routeConfigMap,
+  switchConfig = {}
+) {
+  const router = SwitchRouter(routeConfigMap, switchConfig);
+  const Navigator = createNavigator(SwitchView, router, switchConfig);
+  return Navigator;
+}

packages/animated-switch/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "react-navigation-animated-switch-navigator",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "author": "",
+  "license": "MIT"
+}