@react-navigation/stack#createStackNavigator JavaScript Examples

The following examples show how to use @react-navigation/stack#createStackNavigator. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: activityNavigator.js    From react-native-instagram-clone with MIT License 6 votes vote down vote up 
export default function activityNavigator() {
  const Stack = createStackNavigator();

  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Activity"
        component={activityScreen}
        options={{
          //headerTransparent: true,
          headerTitle: () => (
            <Text style={{color: 'white', fontWeight: 'bold', fontSize: 17}}>
              Activity
            </Text>
          ),
          headerStyle: {
            backgroundColor: colors.bottomBackGround,
            shadowColor: colors.seperatorLineColor,
          },
        }}
      />
    </Stack.Navigator>
  );
}
Example #2
Source File: FitnessPage.test.js    From UltimateApp with MIT License 6 votes vote down vote up 
describe('<FitnessPage />', () => {
  it('renders correctly', async () => {
    const drill = store.getState().drills[0];

    const Stack = createStackNavigator();
    const { toJSON } = render(
      <NavigationContainer>
        <Stack.Navigator>
          <Stack.Screen name="FitnessPage" component={FitnessPage} initialParams={{ drill }} />
        </Stack.Navigator>
      </NavigationContainer>,
    );
    expect(toJSON()).toMatchSnapshot();
  });
});
Example #3
Source File: Modal.js    From duofolio with GNU General Public License v3.0 6 votes vote down vote up 
function ModalNavigator() {
	const Modal = createStackNavigator();
	return (
		<Modal.Navigator mode="modal" headerMode="none" screenOptions={screenOptions}>
			<Modal.Screen name="stack" component={Stack} />
			<Modal.Screen name="dictionary" component={Dictionary} options={noHeader} />
		</Modal.Navigator>
	);
}
Example #4
Source File: homeNavigator.js    From react-native-instagram-clone with MIT License 5 votes vote down vote up 
export default function () {
  const Stack = createStackNavigator();
  StatusBar.setBarStyle('light-content');
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Home"
        component={homeScreen}
        options={({navigation}) => ({
          title: '',
          headerStyle: {
            backgroundColor: colors.bottomBackGround,
            shadowColor: colors.seperatorLineColor,
          },
          headerLeft: () => (
            <View style={Styles.headerLeftContainer}>
              <TouchableOpacity
                onPress={() => navigation.navigate('StoryCameraScreen')}>
                <Image
                  source={images.photo_camera}
                  style={Styles.headerLeftImage}
                />
              </TouchableOpacity>
            </View>
          ),
          headerRight: () => (
            <View>
              <TouchableOpacity
                style={Styles.headerRightContainer}
                onPress={() => navigation.navigate('DirectMessageScreen')}>
                <Image
                  source={images.direct_message}
                  style={Styles.headerRightImage}
                />
              </TouchableOpacity>
            </View>
          ),
          headerTitle: (
            <TouchableOpacity
              style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
              <Image
                source={images.logo}
                style={{width: 110, resizeMode: 'contain'}}
              />
            </TouchableOpacity>
          ),
          headerTitleStyle: {alignSelf: 'center'},
        })}
      />
      <Stack.Screen name="Story" component={StoryScreen} />
      <Stack.Screen
        name="StoryCamera"
        component={StoryCamera}
        options={{gestureDirection: 'horizontal-inverted'}} //for left to right transition
      />
    </Stack.Navigator>
  );
}
Example #5
Source File: App.js    From bluezone-app with GNU General Public License v3.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #6
Source File: App.js    From Get-Placed-App with MIT License 5 votes vote down vote up 
HomeStack = createStackNavigator()
Example #7
Source File: App.js    From Spring2020_MyFood_FrontEnd with GNU General Public License v3.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #8
Source File: App.js    From Solution-Starter-Kit-Cooperation-2020 with Apache License 2.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #9
Source File: App.js    From Solution-Starter-Kit-Disasters-2020 with Apache License 2.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #10
Source File: App.js    From Legacy with Mozilla Public License 2.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #11
Source File: routes.js    From SemanaOmnistack11 with MIT License 5 votes vote down vote up 
AppStack = createStackNavigator()
Example #12
Source File: wallpaper-app-container.js    From React-Messenger-App with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #13
Source File: routes.js    From be-the-hero with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #14
Source File: appNavigator.js    From Baku with GNU General Public License v3.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #15
Source File: App.js    From universal-verifier-app with GNU General Public License v3.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #16
Source File: Navigator.js    From react-native-audio-video-tools with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #17
Source File: AppStack.js    From guardioes-app with Apache License 2.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #18
Source File: home.routes.js    From InstagramClone with MIT License 5 votes vote down vote up 
HomeStack = createStackNavigator()
Example #19
Source File: router.js    From monsuivipsy with Apache License 2.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #20
Source File: routes.js    From atendimento-e-agilidade-medica-AAMed with MIT License 5 votes vote down vote up 
AuthStack = createStackNavigator()
Example #21
Source File: navigation.js    From turkce-sozluk with MIT License 5 votes vote down vote up 
HomeStack = createStackNavigator()
Example #22
Source File: Main.js    From adyen-react-native-online-payments with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #23
Source File: App.js    From MoviesDaily with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #24
Source File: App.js    From salyd with GNU General Public License v3.0 5 votes vote down vote up 
Stack = createStackNavigator()
Example #25
Source File: App.js    From aws-appsync-refarch-offline with MIT No Attribution 5 votes vote down vote up 
CheckoutStack = createStackNavigator()
Example #26
Source File: App.js    From firestore-chat with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #27
Source File: app-stack.js    From React-Native-Boilerplate with MIT License 5 votes vote down vote up 
MainStack = createStackNavigator()
Example #28
Source File: App.js    From ReactNativeApolloOnlineStore with MIT License 5 votes vote down vote up 
Stack = createStackNavigator()
Example #29
Source File: App.js    From ReactNavigationAuthenticationFlowsWithHooks with MIT License 5 votes vote down vote up 
RootStack = createStackNavigator()