BottomTab is not working on my app and it isn't showing any error:
App JS
tabs JS
In your App.js file, the navigator has a props: initialRouteName={'Home'}
This means navigator will load Stack.Screen with name="Home", in this case your app is showing the Home component for the main screen but not the Tabs component for main screen.
My suggestion: change initialRouteName={'Home'} to initialRouteName={'Tabs'} in line 18 of App.js file
Related
my android application work well but when i add drawer navigation library import { createDrawerNavigator } from '#react-navigation/drawer'; in my app only splash screen display, No error are display in cmd. I wait a lot but not open the screen.
I have the following structure inside my main screen:
DrawerNavigator
drawer with a list of screens to navigate
Drawer.Screen
MaterialTopTabNavigator
TopTab.Screen
TopTab.Screen
TopTab.Screen
I need when I click at an item inside the drawer, navigate to a new rote without the drawer, what's the best approach to do it?
I tried with a StackNavigator inside the Drawer to prevent the error of the navigate without an handled navigator not found, but it's navigate with the drawer presents.
Solved with changes on the navigation level:
Stack Navigator
DrawerNavigator
drawer with a list of screens to navigate
Drawer.Screen
MaterialTopTabNavigator
TopTab.Screen
TopTab.Screen
TopTab.Screen
Stack.Screen (the screens on the drawer that I want to navigate)
Special thanks to expo discord community! Hope this helps someone with the same problem.
I have SwitchNavigator for login
after Switchnavigator it redirects to Drawernavigator.
inside Drawernavigator's home component i have Tabnavigator
Now, on tabs components on screen I want to got to a screen which should be out from Drawernavigator where i can popback to Drawernavigator's Tabnavigator.
How to achieve this ?
inside Drawernavigator 's home component i have a button.on click I want to go to a screen which should be out from Drawernavigator where i can popback to Drawernavigator's Tabnavigator.
How to achieve this ?
I have a TabNavigator with 5 Tabs and one of the Tab shows a screen from a StackNavigator with a BackButton because this Screen don't show the Tabs actually.
The StackNavigator is nested in the TabNavigator but where can I go back from the Screen with the backButton? Can I pass a specific route/tab to go back?
I've created a ReactNative app that uses StackNavigator. Whenever the app navigates from one screen to another, it animates the navigation. Is there a way to remove the animation or customize it? StackNavigator also adds a title to each of my screen. Is there a way to remove the screen title? I tried setting the 'title' property of navigationOptions to an empty screen and the screen was rendered without a title. However, navigating from this screen to another one will cause an exception.
e.g. the "welcome" title in these sample screens
To remove the header from a stackNavigator screen, set headerMode in StackNavigatorConfig to none. So, your stackNavigator should look like so:
import HomeScreen from 'path/to/screen';
const stack = StackNavigator({
Home: {
screen: HomeScreen
}
}, {
headerMode: 'none' // <= here
});
There is an active proposal to allow the customization of animation in react navigation. You can follow this open issue