const {Navigator, Screen} = createStackNavigator(); code example
Example 1: react native stacknavigator
import * as React from 'react';
import { View, Text } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
function HomeScreen() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>Home Screen</Text>
</View>
);
}
const Stack = createStackNavigator();
function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
export default App;
Example 2: @react-navigation/native transition like ios
import {
CardStyleInterpolators,
createStackNavigator,
} from '@react-navigation/stack';
const Stack = createStackNavigator();
export default () => (
<Stack.Navigator
screenOptions={{
cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS
}}
>
<Stack.Screen name="Screen 1" component={ScreenComponent1} />
<Stack.Screen name="Screen 2" component={ScreenComponent2} />
</Stack.Navigator>
);