diff --git a/packages/stack/example/App.js b/packages/stack/example/App.js
index 8683f8b9..74f8f27a 100644
--- a/packages/stack/example/App.js
+++ b/packages/stack/example/App.js
@@ -1,12 +1,20 @@
import React from 'react';
import Expo from 'expo';
-import { FlatList } from 'react-native';
+import { FlatList, I18nManager } from 'react-native';
import { createSwitchNavigator } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import { ListSection, Divider } from 'react-native-paper';
import SimpleStack from './src/SimpleStack';
+import ImageStack from './src/ImageStack';
import TransparentStack from './src/TransparentStack';
+import ModalStack from './src/ModalStack';
+import LifecycleInteraction from './src/LifecycleInteraction';
+import GestureInteraction from './src/GestureInteraction';
+
+// Uncomment the following line to force RTL. Requires closing and re-opening
+// your app after you first load it with this option enabled.
+// I18nManager.forceRTL(true);
// Comment the following two lines to stop using react-native-screens
import { useScreens } from 'react-native-screens';
@@ -14,18 +22,26 @@ useScreens();
const data = [
{ component: SimpleStack, title: 'Simple', routeName: 'SimpleStack' },
+ { component: ImageStack, title: 'Image', routeName: 'ImageStack' },
+ { component: ModalStack, title: 'Modal', routeName: 'ModalStack' },
+ { component: LifecycleInteraction, title: 'Lifecycle', routeName: 'LifecycleStack' },
{
component: TransparentStack,
title: 'Transparent',
routeName: 'TransparentStack',
},
+ { component: GestureInteraction, title: 'Gesture Interaction', routeName: 'GestureInteraction' },
];
+Expo.Asset.loadAsync(require('react-navigation/src/views/assets/back-icon.png'));
+Expo.Asset.loadAsync(require('react-navigation/src/views/assets/back-icon-mask.png'));
+
class Home extends React.Component {
static navigationOptions = {
title: 'Examples',
};
+
_renderItem = ({ item }) => (
);
}
diff --git a/packages/stack/example/rn-cli.config.js b/packages/stack/example/rn-cli.config.js
index c049b595..faa16fe9 100644
--- a/packages/stack/example/rn-cli.config.js
+++ b/packages/stack/example/rn-cli.config.js
@@ -4,8 +4,10 @@ const path = require('path');
const glob = require('glob-to-regexp');
const blacklist = require('metro/src/blacklist');
const pak = require('../package.json');
+const pak2 = require('./package.json');
const dependencies = Object.keys(pak.dependencies);
+const localDependencies = Object.keys(pak2.dependencies);
const peerDependencies = Object.keys(pak.peerDependencies);
module.exports = {
@@ -13,7 +15,7 @@ module.exports = {
return [__dirname, path.resolve(__dirname, '..')];
},
getProvidesModuleNodeModules() {
- return [...dependencies, ...peerDependencies];
+ return [...dependencies, ...localDependencies, ...peerDependencies];
},
getBlacklistRE() {
return blacklist([glob(`${path.resolve(__dirname, '..')}/node_modules/*`)]);
diff --git a/packages/stack/example/src/GestureInteraction.js b/packages/stack/example/src/GestureInteraction.js
new file mode 100644
index 00000000..a3be16f1
--- /dev/null
+++ b/packages/stack/example/src/GestureInteraction.js
@@ -0,0 +1,93 @@
+import React from 'react';
+import {
+ ActivityIndicator,
+ Button,
+ InteractionManager,
+ WebView,
+ View,
+ StyleSheet,
+} from 'react-native';
+import { MapView } from 'expo';
+import { createStackNavigator, withNavigationFocus } from 'react-navigation';
+import { StackGestureContext } from 'react-navigation-stack';
+import {
+ PanGestureHandler,
+ NativeViewGestureHandler,
+} from 'react-native-gesture-handler';
+
+const IndexScreen = ({ navigation }) => (
+
+
+);
+
+IndexScreen.navigationOptions = {
+ title: 'Gesture Interactions',
+};
+
+class MapScreen extends React.Component {
+ constructor(props) {
+ super(props);
+ InteractionManager.runAfterInteractions(() => {
+ this.setState({ interactionComplete: true });
+ });
+
+ this.state = {
+ interactionComplete: false,
+ };
+ }
+
+ render() {
+ if (!this.state.interactionComplete) {
+ return (
+
+
+
+ );
+ }
+
+ return (
+
+ {ref => (
+
+
+
+ )}
+
+ );
+ }
+}
+
+MapScreen.navigationOptions = {
+ title: 'MapView',
+};
+
+const WebViewScreen = () => (
+
+ {ref => (
+
+
+
+ )}
+
+);
+
+WebViewScreen.navigationOptions = {
+ title: 'WebView',
+};
+
+export default createStackNavigator({
+ Index: IndexScreen,
+ Map: MapScreen,
+ Web: WebViewScreen,
+});
diff --git a/packages/stack/example/src/ImageStack.js b/packages/stack/example/src/ImageStack.js
new file mode 100644
index 00000000..f726c7ed
--- /dev/null
+++ b/packages/stack/example/src/ImageStack.js
@@ -0,0 +1,89 @@
+import React from 'react';
+import { Dimensions, Button, Image, View, Text } from 'react-native';
+import { createStackNavigator } from 'react-navigation-stack';
+import { FlatList, BorderlessButton } from 'react-native-gesture-handler';
+
+class ListScreen extends React.Component {
+ static navigationOptions = ({ navigation }) => ({
+ title: 'Image list',
+ headerBackTitle: 'Back',
+ headerLeft: (
+