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
3 answers

How can I close a modally opened window with its own navigation stack?

I have the following structure in my React Native project, suggested by this answer: export const Root = () => { const RootStack = useMemo(() => createStackNavigator(), []); const HomeStack = useMemo(() => createStackNavigator(), []); …
2
votes
1 answer

How can ı create login authentication from a tab screen using react navigation?

I designed two tab screens. One of them can be accessed by everyone ,we need to login to the other. I am using API to login. If the username and password are correct, the login process is completed. But after logging in , ı cannot switch to the main…
Merve
  • 21
  • 2
2
votes
1 answer

Why does the React navigation bottom bar cover the layout?

I have a bottom bar like in the picture, but this bar prevents the bottom of my pages from appearing. How can I give the bottom of the page as much space like the height of the bottom bar? Thanks in advance.
2
votes
1 answer

How to refactor 'createSwitchNavigator' code in react-navigation-6?

Below is the code which uses react-navigation version-4. But in version-6 createSwitchNavigator is completely removed. How do I refactor the below code to make it work? I do not want to use the react-native-compat package. import React from…
Abhishek Vyas
  • 599
  • 1
  • 9
  • 24
2
votes
1 answer

When upgrading react-navigation from v5 to v6, should we still import react-native-gesture-handler at the top?

The documentation for react-navigation v5 mentions this: To finalize installation of react-native-gesture-handler, add the following at the top (make sure it's at the top and there's nothing else before it) of your entry file, such as index.js or…
hndvf
  • 101
  • 8
2
votes
2 answers

React Native deep linking is not working on real device

I use uri-scheme for environment setup and testing and follow the steps from React Navigation Doc to set up navigation. When I test on the emulator by npx uri-scheme open myapp://do_something/some_params --{android/ios} everything looks good. It…
legenddaniel
  • 698
  • 2
  • 9
  • 17
2
votes
0 answers

react native sentry doest not send crash reports under NavigationContainer

we have self hosted sentry server (Sentry 21.11.0 172bad1), our react native SDK is : "@sentry/react-native": "^3.0.2" sentry can detect all crashes all over the app ( because events logs are available in beforeSend function ) but only crashes in…
2
votes
3 answers

react navigation deep linking not working when use Tabs Stack

Version: "dependencies": { "react-native": "0.63.4", "@react-navigation/bottom-tabs": "^5.11.2", "@react-navigation/native": "^5.8.10", "@react-navigation/stack": "^5.12.8", } Test website link test://info_register?token=1111 successfully,…
Morton
  • 5,380
  • 18
  • 63
  • 118
2
votes
2 answers

How to make my bottom navbar disappear when the keyboard is appearing React Native Navigation

When I click on a text input and the keyboard pops up, how do I make the navbar disappear/hide? The navbar in red should disappear when the keyboard appears.
Arnaud P
  • 117
  • 5
2
votes
2 answers

React Navigation 6: Override parent navigator's header configuration from an screen inside child navigator

I have a BottomTab navigator nested inside an Stsck navigator. And the header is configured via Stack screenOptions: function AppStackNavigator() { return (
Kasra
  • 1,959
  • 1
  • 19
  • 29
2
votes
2 answers

Right-to-left screen animation in React Native navigation

I'd like to have screen animations from right to left in React Native. I checked a lot in the internet but most of the examples are old and they are using StackNavigator differently and the configurations are also different. I think they are using…
Feyyaz
  • 561
  • 1
  • 5
  • 12
2
votes
1 answer

Using merge:true with nested navigator

Per the RN documentation, the proper way to use merge is as follows: navigation.navigate({ name: 'Post', params: { postTitle: 'An okay post' }, merge: true, }); I'd like to use merge in my app, however my navigate function looks a bit…
2
votes
0 answers

react-navigation 6 not passing parameters to nested stack navigator on first render

I have a stack navigator inside a tab navigator, and when I navigate to a screen within that stack from another tab parameters are not available on the stack screen the first time through. After that, they are as expected. Here's the stack nav…
Max Metral
  • 261
  • 3
  • 12
2
votes
0 answers

error 'undefined is not an object' using @react-navigation/drawer (checked docs and issues)

I'm not sure what the issue is, but I've looked at the docs and it's done correctly, and I've even looked at issues on Github and SO and nobody seems to be having the exact same issue. Here is what I'm using: React Native .66.1 React Navigation…
Joel Hager
  • 2,990
  • 3
  • 15
  • 44
2
votes
2 answers

How do i skip the animation only replace with react-navigation

i am using @react-navigation/stack^5.14.4 and @react-navigation/native^5.9.4, to handle the scene transition between Home, Login and Profile pages. there are 2 transition cases i need to handle: Home -> Profile (should have animation enabled) Login…
Jacky Lau
  • 665
  • 5
  • 21
1 2 3
99
100