Questions tagged [react-navigation-bottom-tab]
422 questions
1
vote
0 answers
Hide Header of Bottom tab bar inside nested stack screen in react native
I have a Bottom tab bar navigator with three Tabs:
HomeStack
History
Account
the HomeStack is a a stack navigator of two screens:
HomeScreen
TestScreen
I would like to hide the header of the stack navigator in both screens , which is done
and i…
Zero0
- 371
- 4
- 15
1
vote
0 answers
Remove Extra scroll with react-navigation/bottom-tabs
I made a very simple test application with React Native and react-navigation/bottom-tabs but there is a small extra scroll that appears when adding this bottom tab. See picture below. Is there any way to remove it ?
The code is the…
Kantine
- 747
- 6
- 14
1
vote
1 answer
React navigation tab navigator - Always pass the same route params when pressing tab
I'm new here! I'm working with react navigation, and I love it!... but... I've run into an issue that I figure is user error and not a bug.
What are the details of your problem?
I made a minimal example in a snack here:…
Johnathan Simeroth
- 21
- 4
1
vote
1 answer
React native maps error while navigation between screens
I am currently building a React Native application that comprises four different screens Home, Products, FAQs, and Locations. The HomeScreen is a static screen with no content displayed. The Products, FAQs, and Locations screens all retrieve their…
user3872094
- 3,269
- 8
- 33
- 71
1
vote
1 answer
React native react-navigation/bottom-tabs problem with tabBarBadgeStyle
I am new to react native. I am struggling to solve the issue. I want to change tabBarBadgeStyle to whether it's active or not.
HimonHimu
- 104
- 7
1
vote
0 answers
ERROR @react-navigation/bottom-tabs could not be found within the project
Hi there! I'm developing applications in visual studio code with react native but I'm getting this error in the bottom tab navigation section.Can you help?
wherever the problem is, I would be very glad if you could tell me how to fix it
gizemsivri
- 11
- 2
1
vote
2 answers
Bottom tab bar navigation covering and hiding background image. Image gets cut by the bar
The app is developed with react-native and expo.
I have this simple layout and structure:
A navigator js file with bottom-tab-bar navigation, that directs to pages, and is imported to App.js
The problem is that the tab navigator is covering the…
DanielG
- 11
- 2
1
vote
1 answer
How can I render DrawerLayout from react-native-gesture-handler on top of my TabNavigator?
App using react-navigation 6
App have TabNavigator and I need to have Drawer that rendered on top of TabNavigator that render Items, that could be selected, and based on what Item was selected I need to change screen in the same Tab in…
1
vote
0 answers
Upgrading to react-native-paper 5.2 changed @react-navigation/material-bottom-tabs
Material-Bottom-Tabs active icon with react-native-paper version 4.9.2 looks like
Material-Bottom-Tabs active icon with react-native-paper version 5.2.0 looks like
I tried searching for something like shadow, background, highlight etc. without…
tomwaitforitmy
- 509
- 3
- 16
1
vote
1 answer
Hiding header in bottom tab navigator not working
I have a react native expo app with a bottom tab navigator. How do I hide a specific screen header?
Here is my code:
export default function MainContainer() {
const Tab = createBottomTabNavigator();
const {toggleColorMode} = useColorMode();
…
Pavel Košnar
- 11
- 2
1
vote
1 answer
How to hide react bottom navigation without showing animation?
Bottom navigation tabs don't hide without animation. Whenever I use the text input in react native bottom navigation tab is pushed up by the keyboard. That was somewhat solved by using:
screenOptions={{
tabBarHideOnKeyboard: true,
}}
However, even…
Mynameiswha
- 51
- 5
1
vote
0 answers
Why does React Native BottomTabNavigator re-render child1 (which uses only stateA) when child2 (uses only stateB) calls setStateB and how to avoid?
I notice that when I go to the AwayScreen and change the value of stateB by calling setStateB, the HomeScreen re-renders, even though the HomeScreen uses only stateA and the AwayScreen uses only StateB.
This only happens after I have clicked on the…
Will Thrive
- 11
- 3
1
vote
2 answers
how to remove the active icon background color (the purple tint here)? react bottom tab navigation
bottom barbottom bar herecode screenshot
"@react-navigation/material-bottom-tabs": "^6.2.11",
"@react-navigation/native": "^6.1.2",
tried tabBarOptions,activeTintColor.
Pratham Rohatgi
- 33
- 6
1
vote
1 answer
Why am I getting 'Element type is invalid: expected a string or a class/function but got: number' when I try and import an svg file into a component?
When I import svg files into my BottomTabNavigator I get the following Render Error:
Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: number.
How do I get rid of this…
alski
- 11
- 4
1
vote
1 answer
Tab bottom navigation react native
I new in react-native and junior developer.
I'm using react-native v0.70.6
@react-navigation/stack and @react-navigation/bottom-tabs.
My tab bottom component looks like this:
Guido Gagliardini
- 51
- 8