All Questions
Tagged with react-native react-native-navigation
1,878
questions
92
votes
3
answers
31k
views
React Navigation vs. React Native Navigation [closed]
What are the technical differences between the main two React Native navigation solutions: React Native Navigation and React Native?
React Navigation
React Native
Navigation
Are there specific ...
90
votes
13
answers
145k
views
Getting this error: error: bundling failed: Error: Unable to resolve module `react-native-safe-area-context`
I am getting this error after running my App:
error: bundling failed: Error: Unable to resolve module react-native-safe-area-context from node_modules/react-navigation-stack/lib/module/vendor/views/...
69
votes
19
answers
128k
views
Refresh previous screen on goBack()
I am new to React Native. How can we refresh/reload previous screen when returning to it by calling goBack()?
Lets say we have 3 screens A, B, C:
A -> B -> C
When we run goBack() from screen ...
42
votes
8
answers
65k
views
How to trigger an event when a component is shown when using react-native-navigation?
I am using react-native with react-native-navigation. I would like to reload data when a component is shown. The component is shown when a user clicks on a tab navigation button.
Should I use react ...
36
votes
3
answers
64k
views
Couldn't find a navigation object. Is your component inside a screen in a navigator?
In My below code when I use useNavigation() then it gives an error like my quiestion
How to use useNavigation, Please any one can solve this error... ERROR:Couldn't find a navigation object. Is your ...
33
votes
2
answers
3k
views
React-native app is being restarted on every navigation when integrated with native app
We're trying to integrate a new React Native app to an existing native Android app. Following the RN official docs we managed to get it working but with some issues regarding the navigation.
We've ...
31
votes
7
answers
14k
views
React Native: Which navigator should I use? [closed]
I have to build a relatively big cross-platform (iOS & Android) application within 3 months.
So far when it comes to React Native I only have experience with NavigatorIOS. Now while I never ...
29
votes
14
answers
68k
views
How to hide bottom navigation bar on a specific screen in react native?
I am using React Native and React Native Navigation to build out my application. Currently, I have three bottom tabs: Home, Upload Video and Messages. Upon selection of the Upload Video tab, I want to ...
28
votes
6
answers
42k
views
Error: Unable to resolve module ` react-native-screens` from `node_modules/react-navigation-tabs/src/navigators/createBottomTabNavigator.js`
Current Behavior
After executing app is not installing reporting
bundling failed: Error: Unable to resolve module `
react-native-screens` from `node_modules/react-navigation-tabs/src/navigators/...
27
votes
7
answers
46k
views
How to use navigation.navigate from a component outside the stack.navigation
I have an application using React native where I am using react-navigation (5.2.9).
I built a Stack.Navigator where I've got my screens but I want the Footer component to be outside so it renders in ...
23
votes
9
answers
19k
views
Requiring unknown module "11" error on iOS simulator
When I run the react native project with react-native run-ios.It shows the following error on my iOS simulator.On my android simulator, it is totally ok.I have deleted node module and reinstalled.But ...
17
votes
1
answer
2k
views
How to cold start a React Native app over device lock screen?
I'm building a VoIP app on React Native, which detects incoming calls using push notifications. I need to start the app and bring it to the foreground on receiving a push notification. I'm able to ...
16
votes
1
answer
2k
views
Disadvantage of using JS based navigation solution like React Navigation instead of using Native Navigation like Wix's React Native Navigation?
The only reason I can think of using Native Navigation is when I have more screens & JS based solution like React Navigation will keep all the screens in memory. Now I am not a native developer so ...
15
votes
11
answers
29k
views
React Navigation V5 Hide Bottom Tabs
I would like to be able to hide the tabs on a screen using React Native Navigation v5.
I've been reading the documentation but it doesn't seem like they've updated this for v5 and it refers to the &...
14
votes
11
answers
41k
views
Error: A navigator can only contain 'Screen' components as its direct children
I am new to React Native and I am getting this error, but I am not able to resolve it.
I am following the tutorial from the main react-navigation page, but I am not able to complete it.
I will ...
14
votes
1
answer
648
views
Custom component topbar button event RNN v2
I have a custom component 'MenuButton' in my RNNv2 topbar. I want openMenu() to run when this button is clicked, but this doesn't happen. My typescript linting tells me Property openMenu does not ...
13
votes
11
answers
27k
views
White flickering when transitioning to a new screen and the background is a dark color?
I am experiencing this when transitioning to one screen to another with two different navigators: ex-navigation and the new one React Navigation
. There is a white flickering for a second (or half a ...
13
votes
5
answers
3k
views
'Failed to find fragment for React Root View' React Native Android RNScreens
I had to rebuild my gradle for android, and now I'm getting an error with RNScreens.
Failed to find fragment for React Root View shows in the app.
Here is logcat:
2022-08-20 22:54:02.259 9195-9241/com....
11
votes
4
answers
10k
views
React Native Navigation and Redux Persist
I am trying to integrate redux-persist with wix react-native-navigation. However, I am unable to find any examples or documentation stating the boilerplate code needed to integrate the both libraries. ...
10
votes
3
answers
6k
views
How to open application's location permission settings directly in React Native
REACTNATIVE : Currently using Linking.openSettings() to open my application settings page.
Now, I want to open the app permission screen directly, which is inside the App settings to enable ...
10
votes
1
answer
8k
views
How to send data to the parent page using React Native Navigation (v5)?
I'm using https://reactnavigation.org/ (version 5.0.1) in my project with GraphQL Apollo client.
I have a page with a form where the user needs to select some options from a list.
In the first page, ...
10
votes
1
answer
7k
views
React-navigation tabbar larger icon in the middle
Please feel free to point me in the correct direction if this has been answered elsewhere, but I can't find it via here, or Google. Maybe I just don't know this correct name for this thing?
I am ...
10
votes
0
answers
9k
views
How to auto-hide react-navigation header with scroll down?
How can I automatically hide a header with a scroll-down action and show the header with a scroll-up action in Android using react-navigation in React Native?
const HomeStack = ...
9
votes
1
answer
9k
views
Bootstrap method returned null - Android crash immediately on launch
Newbie to React Native and react-native-navigation. App works correctly on iOS but throws the exception below very quickly on launch:
E/AndroidRuntime: FATAL EXCEPTION: main
Process: com....
9
votes
1
answer
25k
views
How to unmount a previously mounted component in stack navigator (react-navigation 2.X)?
This is a simplified flow of my app:-
login
homepage (has options to color diagram or create diagram)
colorInDiagram (user colors parts of a diagram)
makePayment
homepage(back to homepage)
Now, ...
9
votes
2
answers
17k
views
react-native: Command `run-android` unrecognized. Maybe caused by npm install
Recently I started getting this issue, when I install a react-native package
(eg: react-navigation) into my project, a whole bunch of packages are been removed (including react, react-native i think)....
9
votes
1
answer
20k
views
How to create a custom top navigation bar in React Native
Hi i am building an app in React Native and I want to have a customized tabbar. I have tried it with React navigation but I can't figure out how to style the way I want...
This is what I want it to ...
8
votes
3
answers
13k
views
Change the default light grey background color
By default, every screen I created in react-native project use a very light grey color as its background color. As you see here:
I wonder instead of I set backgroundColor for each screen of my ...
8
votes
5
answers
16k
views
WARN Sending `onAnimatedValueUpdate` with no listeners registered
I got stuck. I am developing a mobile application with React Native CLI & React Navigation 6.x Then when i use material top tabs navigator, swiping through left to right or right to left. It ...
8
votes
2
answers
9k
views
Pass props through CreateAppContainer
I'm trying to pass props through AppContainer. I was able to pass in through other components, but I can't figure out how to send props through createAppContainer
in App.js:
render() {
return (
...
8
votes
3
answers
26k
views
How to render svg image in React-Native?
Please try to help me!
I need to render svg image from my folder "project/assest/images/test.svg" on android and ios view.
I have tried :
Solution 1 : <Image source={imagePath}></Image>
...
8
votes
3
answers
7k
views
Combine createStackNavigator and createBottomTabNavigator?
Scenario :
I have an app working with three tabs for navigation (School, Admin, Family);
I am now trying to add in other screens, that will not have corresponding tabs. These screens will be ...
8
votes
5
answers
5k
views
store.getState is not a function Redux-persist
I'm trying to implement Redux-persist on my React Native app. Following the setup docs exactly, I changed my store.js from this:
import { applyMiddleware, createStore } from 'redux';
import * as ...
8
votes
0
answers
6k
views
"Should have a queue. This is most likely a bug in React. Please file an issue. " React-Native bug
I am getting the error in the title on a React-Native app that I am currently working on.
I have gone through hours of troubleshooting, and there doesn't seem to be a solution online.
From what I ...
8
votes
0
answers
2k
views
Pure React Native app crashes on swiping after opening it in Release mode
I am using React-Navigation for my pure RN 0.61.2 app. The app runs perfectly when I use it on Debug mode. However, in Release mode when I try to open the Drawer Navigation menu or scroll down in a ...
8
votes
1
answer
1k
views
Can't Add ReactNativeNavigation.xcodeproj to Libraries in Xcode
I can't add the ReactNativeNavigation.xcodeproj file to my projects Libraries. Any ideas on how to get around this? I left click on Libraries then click add files to my project then go into ...
8
votes
1
answer
2k
views
React navigation v6 Modal with ScrollView inside - swipe down modal when top scrollview reached
I have a problem with the modal-presentation of react-navigation v6 to present a modal with ScrollView inside of it.
Actually if I enable gesture to swipe down the modal, it doesn't work if there is a ...
7
votes
10
answers
6k
views
TypeError: (0, _native.useTheme) is not a function. (In '(0, _native.useTheme)()', '(0, _native.useTheme)' is undefined)
I created a drawerNavigator and now I'm trying to add an icon to the header. The issue is when I add my HeaderButton I get this error:
Component exception
In the navigationOptions I tried to use both ...
7
votes
3
answers
11k
views
How to remove screens (unmount component) from react native drawer-navigator on log out?How to reload Components Data?
I am using react navigation v3 in my app, I use stack navigator inside drawer navigator ,On the click of logout I navigate to login screen with clearing storage of user, But whenever I login again , ...
7
votes
2
answers
10k
views
React Native: Migrate to AndroidX
I ran my Android RN project today and was presented with the following error
Execution failed for task ':app:transformDexArchiveWithExternalLibsDexMergerForDebug'.
> com.android.builder.dexing....
7
votes
6
answers
5k
views
How goBack screen in test with detox
I make automatization react native test with detox, It has the next screen sequence A -> B -> C and i wish to go back to the screen B <- C.
Is there a solution for this?
7
votes
3
answers
10k
views
Highlight Current Active Drawer menu in React navigation v5
I have created a custom drawer navigator using react navigation version: 5.X,
But the current active tab is not getting highlighted in custom drawer menu.
I have added 'activeTintColor' in ...
7
votes
2
answers
9k
views
Unable to resolve "fbjs/lib/areEqual" from "node_modules\react-native-gesture-handler\createHandler.js"
I'm building a react-native application with expo, however, I have an error, therefore I'm unable to continue building the application. I even looked for the file in node_modules that is mentioned in ...
7
votes
1
answer
11k
views
How to set Icon size in react-native-navigation bottom tab bar
I just start to learn RN, but the docs in https://reactnavigation.org/docs/tab-based-navigation/ did not show how to set a tabBarIcon's size, I tried to add an attribute in <Tab.Navigator> like ...
7
votes
1
answer
2k
views
Hide parent's navigation header from the nested navigator
I'm developing my first react native app. I've an issue with the nested navigations in the app.
I've the following navigations:
Main App Navigator : createStackNavigator
Authentication Navigator : ...
7
votes
2
answers
3k
views
Blank white screen on android using react-native (release only)
My app is running fine on the emulator in debug mode. When I tried to use a signed APK on a device or run it in release mode on the emulator using:
react-native run-android --variant=release
It just ...
7
votes
2
answers
2k
views
Rendering react navigation screens inside a scrollview
I am building a react native app where I want to add a scrollview as a wrapper to all the UI screens. I have wrapped the Stack.Navigator in a ScrollView but the content is clipped at the bottom of the ...
7
votes
1
answer
3k
views
Why is this.props.componentId needed?
Why is this.props.componentId needed?
What is its purpose?
Why can't we use the library without that id being needed?
react-navigation doesn't need something like that, and react-native-navigation ...
6
votes
4
answers
12k
views
How to set react-native drawer header icon ('Hamburger') to the right side?
I set the drawer right-side, but the hamburger icon, in the screen header, stays default left side, Is there any property to pass through to change position to the right? I know it should be done with ...
6
votes
5
answers
38k
views
React Native Navigation - swipe to next screen
I have a very simple configuration for react native navigation
Navigation.startTabBasedApp({
tabs: [
{
label: "One",
screen: "example.FirstTabScreen",
title: "Screen One"
}...