mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-02-07 22:43:48 +08:00
61 lines
1.2 KiB
JavaScript
61 lines
1.2 KiB
JavaScript
import * as React from 'react';
|
|
import { Button, TextInput, View } from 'react-native';
|
|
import {
|
|
createStackNavigator,
|
|
CardStyleInterpolators,
|
|
} from 'react-navigation-stack';
|
|
|
|
class Input extends React.Component {
|
|
static navigationOptions = {
|
|
title: 'Input screen',
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<TextInput
|
|
placeholder="Type something"
|
|
style={{
|
|
backgroundColor: 'white',
|
|
paddingVertical: 12,
|
|
paddingHorizontal: 16,
|
|
margin: 24,
|
|
}}
|
|
/>
|
|
);
|
|
}
|
|
}
|
|
|
|
class Home extends React.Component {
|
|
static navigationOptions = {
|
|
title: 'Home',
|
|
};
|
|
|
|
render() {
|
|
return (
|
|
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
|
|
<Button
|
|
onPress={() => this.props.navigation.push('Input')}
|
|
title="Push screen with input"
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const App = createStackNavigator(
|
|
{
|
|
Home: { screen: Home },
|
|
Input: { screen: Input },
|
|
},
|
|
{
|
|
headerMode: 'screen',
|
|
defaultNavigationOptions: {
|
|
cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
|
|
gestureDirection: 'horizontal',
|
|
gestureEnabled: true,
|
|
},
|
|
}
|
|
);
|
|
|
|
export default App;
|