Questions tagged [react-navigation]

An easy-to-use navigation solution to be used in React Native projects

React Navigation is a easy to use navigation solution for projects. It supports both Android and iOS platforms with platform specific UI design and behavior.

This library completely coded with Javascript which let's you customize any part of it with the desired behavior without the need of any native code knowledge.

It is built and funded by Expo, with contributions from the community.

Resources

8419 questions
2
votes
2 answers

How to combine bottom tab navigator with drawer navigator

My tab below code is a bottom-tab navigator code and I want to display it on every screen by rendering it on app.js as I did for the drawer navigator (in simple words I want to call the bottom tab navigator on screen) const Stack =…
2
votes
1 answer

how to get symbol(child_state) value in react-navigation 6?

The logic was developed using the route.state.index value in the existing code. After upgrading to 6, "state" went into Symbol(CHILD_STATE), but I don't know how to access it. The value I want is an index with a numeric value of 2
rudenick
  • 154
  • 1
  • 1
  • 10
2
votes
1 answer

How to change default background colour in React Native

I recently updated from RN 0.60 to 0.65, and after hours of debugging I can get my app to build and run again. However, for some reason the background colour of my app has changed from white to gray. I'm using react-native-router-flux for…
2
votes
0 answers

Back button doesn't show in React Navigation 6.x with nested navigators

My React Native app has a root Stack Navigator with some screens and nested navigators: /* Root Stack Navigator */ const disableBackButtonOpts = { headerBackVisible: false, gestureEnabled: false }
2
votes
3 answers

React Native Stack Navigation Modal Not Sliding

I'm new to React Native and I'm trying to navigate to one of my screens. I would like the screen to open as a modal. Apparently, you should apply the screenOptions={{ presentation: 'modal'}} to the Stack.Navigator. The screen is opening but not as…
Ashraf Lobo
  • 137
  • 4
  • 16
2
votes
2 answers

How can I change drawerActiveBackgroundColor in React Navigation 6?

How can I change drawerActiveBackgroundColor in React Navigation 6 here is my code: }> …
2
votes
0 answers

In React-Native, how can I get to .push() a screen from a modal screen using react navigation?

I'm displaying a full screen modal using react navigation. How can I push some other screens without closing the modal ? Calling navigation.push('test') does not seem to work. Is it even feasible ?
JSharles
  • 565
  • 1
  • 5
  • 16
2
votes
2 answers

Why does tabBarIcon not navigate to my component in my Tab.Screen?

When building a custom Tab.Screen I've tried to pass a custom tabBarIcon. While the icon renders it will not navigate to the component TestScreen. In the docs for tabBarIcon my understanding the Tab.Screen should be written as:
2
votes
0 answers

How to add outside box shadow in react navigation bottom tabs?

I would like to add a outside box shadow in react-native-navigation. The desired effect should look like this: Currently when I apply styles the outside box shadow does not change: import React, { FunctionComponent } from 'react' import…
2
votes
1 answer

can't find variable: user. I am using firebase auth and the latest SDK, expo SDK 42, react navigation 6.x.x

import { StyleSheet, Text, View } from "react-native"; import { NavigationContainer } from "@react-navigation/native"; import { createNativeStackNavigator } from "@react-navigation/native-stack"; import LoginScreen from…
2
votes
1 answer

Cannot use yarn android after adding react navigation 6.x

So I'm using https://reactnavigation.org/docs/getting-started to make my navigation. I did the yarn add @react-navigation/native and yarn add react-native-screens react-native-safe-area-context. At this point my app is still fine even after…
Dragonarc
  • 73
  • 2
  • 10
2
votes
0 answers

react-navigation [v6] drawer and stack nesting issues

Like the most common use case, I want to have a drawer in my react-native application where, from all screens header I can open/close the drawer, navigate to them. Also, each screen has an option (button, card,...) that on press should navigate to…
2
votes
2 answers

Navigate in react using react-router-dom 6

I am working on a React app where I am trying to navigate from a loginform to the homescreen of my app using an onSubmit function. This is what I have so far. In my formik form im trying to pass the email value when the form gets submitted. After…
John
  • 97
  • 1
  • 7
2
votes
0 answers

Navigating to a specific screen introduces a breaking bug

I'm building an app in React Native where a user can plan out novels by creating and storing characters, locations, and chapters, with details about them. Currently, there is an issue where navigating to the screen where one can edit a character's…
2
votes
1 answer

How to make sure that the value of a setState variable is undefined when passing it as a parameter?

Using react native, I wanted to pass cookBooks to another screen. I can confirm that cookBooks was updated inside useEffect. But when I pass it as a parameter to another screen, no data was passed. interface IBook { userId?: string; referenceId:…
Junior
  • 147
  • 4
  • 12
1 2 3
99
100