mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-02-08 09:13:02 +08:00
92 lines
2.1 KiB
JavaScript
92 lines
2.1 KiB
JavaScript
import * as React from 'react';
|
|
import {
|
|
ActivityIndicator,
|
|
Button,
|
|
InteractionManager,
|
|
WebView,
|
|
View,
|
|
} from 'react-native';
|
|
import { MapView } from 'expo';
|
|
import {
|
|
createStackNavigator,
|
|
StackGestureContext,
|
|
} from 'react-navigation-stack';
|
|
import { NativeViewGestureHandler } from 'react-native-gesture-handler';
|
|
|
|
const IndexScreen = ({ navigation }) => (
|
|
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
|
|
<Button title="Go to MapView" onPress={() => navigation.navigate('Map')} />
|
|
<Button title="Go to WebView" onPress={() => navigation.navigate('Web')} />
|
|
<Button
|
|
title="Return to other examples"
|
|
onPress={() => navigation.navigate('Home')}
|
|
/>
|
|
</View>
|
|
);
|
|
|
|
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 (
|
|
<View
|
|
style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}
|
|
>
|
|
<ActivityIndicator />
|
|
</View>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<StackGestureContext.Consumer>
|
|
{ref => (
|
|
<NativeViewGestureHandler waitFor={ref}>
|
|
<MapView style={{ flex: 1 }} />
|
|
</NativeViewGestureHandler>
|
|
)}
|
|
</StackGestureContext.Consumer>
|
|
);
|
|
}
|
|
}
|
|
|
|
MapScreen.navigationOptions = {
|
|
title: 'MapView',
|
|
};
|
|
|
|
const WebViewScreen = () => (
|
|
<StackGestureContext.Consumer>
|
|
{ref => (
|
|
<NativeViewGestureHandler waitFor={ref}>
|
|
<WebView
|
|
style={{ flex: 1 }}
|
|
source={{ uri: 'https://news.google.com' }}
|
|
/>
|
|
</NativeViewGestureHandler>
|
|
)}
|
|
</StackGestureContext.Consumer>
|
|
);
|
|
|
|
WebViewScreen.navigationOptions = {
|
|
title: 'WebView',
|
|
};
|
|
|
|
export default createStackNavigator({
|
|
Index: IndexScreen,
|
|
Map: MapScreen,
|
|
Web: WebViewScreen,
|
|
});
|