diff --git a/example/App.js b/example/App.js
index da50c7a..400bad2 100644
--- a/example/App.js
+++ b/example/App.js
@@ -8,6 +8,7 @@ import { ListSection, Divider } from 'react-native-paper';
import SimpleStack from './src/SimpleStack';
import TransparentStack from './src/TransparentStack';
import ModalStack from './src/ModalStack';
+import GestureInteraction from './src/GestureInteraction';
// Comment the following two lines to stop using react-native-screens
import { useScreens } from 'react-native-screens';
@@ -21,6 +22,7 @@ const data = [
title: 'Transparent',
routeName: 'TransparentStack',
},
+ { component: GestureInteraction, title: 'Gesture Interaction', routeName: 'GestureInteraction' },
];
class Home extends React.Component {
diff --git a/example/src/GestureInteraction.js b/example/src/GestureInteraction.js
new file mode 100644
index 0000000..f605bb4
--- /dev/null
+++ b/example/src/GestureInteraction.js
@@ -0,0 +1,58 @@
+import React from 'react';
+import { Button, WebView, View, StyleSheet } from 'react-native';
+import { MapView } from 'expo';
+import { createStackNavigator } from 'react-navigation';
+import { GestureContext } from 'react-navigation-stack';
+import {
+ PanGestureHandler,
+ NativeViewGestureHandler,
+} from 'react-native-gesture-handler';
+
+const IndexScreen = ({ navigation }) => (
+
+
+);
+
+class MapScreen extends React.Component {
+ render() {
+ return (
+
+ {ref => (
+
+
+
+ )}
+
+ );
+ }
+}
+
+MapScreen.navigationOptions = {
+ title: 'MapView',
+};
+const WebViewScreen = () => (
+
+
+
+);
+
+WebViewScreen.navigationOptions = {
+ title: 'WebView',
+};
+
+const DrawerExample = createStackNavigator(
+ {
+ Index: IndexScreen,
+ Map: MapScreen,
+ Web: WebViewScreen,
+ },
+ {
+ contentOptions: {
+ activeTintColor: '#e91e63',
+ },
+ }
+);
+
+export default DrawerExample;
diff --git a/package.json b/package.json
index 4a2e7b5..1711c2e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-navigation-stack",
- "version": "0.6.0",
+ "version": "1.0.0-alpha.0",
"description": "Stack navigator component for React Navigation",
"main": "dist/index.js",
"files": [
diff --git a/src/index.js b/src/index.js
index f547311..9ae7d46 100644
--- a/src/index.js
+++ b/src/index.js
@@ -52,4 +52,7 @@ module.exports = {
get ScenesReducer() {
return require('./views/ScenesReducer').default;
},
+ get GestureContext() {
+ return require('./utils/GestureContext').default;
+ }
};
diff --git a/src/utils/GestureContext.js b/src/utils/GestureContext.js
new file mode 100644
index 0000000..69a6eed
--- /dev/null
+++ b/src/utils/GestureContext.js
@@ -0,0 +1,4 @@
+import React from 'react';
+
+const GestureContext = React.createContext(null);
+export default GestureContext;
\ No newline at end of file
diff --git a/src/views/StackView/StackViewLayout.js b/src/views/StackView/StackViewLayout.js
index d69b734..feba0bb 100644
--- a/src/views/StackView/StackViewLayout.js
+++ b/src/views/StackView/StackViewLayout.js
@@ -1,6 +1,7 @@
import React from 'react';
import clamp from '../../utils/clamp';
+import GestureContext from '../../utils/GestureContext';
import {
Animated,
StyleSheet,
@@ -120,6 +121,7 @@ class StackViewLayout extends React.Component {
constructor(props) {
super(props);
+ this.panGestureRef = React.createRef();
this.state = {
// Used when card's header is null and mode is float to make transition
@@ -295,15 +297,18 @@ class StackViewLayout extends React.Component {
return (
0 && gesturesEnabled}
>
-
- {scenes.map(s => this._renderCard(s))}
-
- {floatingHeader}
+
+
+ {scenes.map(s => this._renderCard(s))}
+
+ {floatingHeader}
+
);