Questions tagged [react-navigation-bottom-tab]
422 questions
0
votes
1 answer
expo react-navigation 5.x, Bottom Tab Navigator works differently on IOS and Android when wrapped in Drawer Navigator
wanted to implement Bottom Tab Navigator with a Custom Styled Central Tab Icon and a DrawerNavigator. When the BottomTab is wrapped with DrawerNavigator, the Center Button that has roundness gets clipped on Android (ok on IOS)
For Android
For IOS…
Hani Q
- 135
- 2
- 15
0
votes
1 answer
@react-navigation/bottom-tabs always getting undefined component
i'm trying to create nested Navigation (Bottom Tab with Stack), but when im passing the screen component
Fachry Ansyah
- 53
- 1
- 5
0
votes
0 answers
I cannot render BottomTab Navigator on each screen
I react Native app I'm building I want to always see BottomTab Navigator, on each screen.
Currently it works as I open the Drawer.Navigator from CustomHeader "Menu" button. And once I navigate to component , for example "Profil" then ButtomTab…
marcinb1986
- 708
- 1
- 11
- 30
0
votes
1 answer
How to add a buttont that handle display of DrawerNav to TabNav
How to implement a buttom navigator that containt a button that handle DrawerNav display
Aymen
- 248
- 3
- 15
0
votes
1 answer
ReferenceError: React is not defined (React Navigation / Bottom Tabs Navigation)
following this tutorial I am trying out the bottom Tab Navigator
But for some reason I get the error "ReferenceError: React is not defined"
Here is my code
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import TestScreen…
Martin
- 1
0
votes
2 answers
React native clear Stack Navigator stack in bottom tab bars
I am developing an app which has bottom tab navigation. For implementing this , I've used react-navigation-material-bottom-tabs, which is working perfectly fine. Like I have 3 screens ,say Home, Profile and About in the bottom tab navigator. But in…
Najam Us Saqib
- 3,190
- 1
- 24
- 43
0
votes
1 answer
Using 2 Drawer Navigator in one project
I have 2 DrawerNavigators, one of them(PaymentHistoryDrawer) is inside the BottomTabNavigator. I bind them to two buttons - the 1st for the HamburgerMenu , the 2nd for the FilterButton inside Payment History.
export const DrawerNavigator = () => (
…
0
votes
1 answer
How to update use context variable from child component in react native
I am using useMemo and useContext hooks to store state of login and logout in my react native application.
import { AuthContext } from "./src/app/context";
export default () => {
const [isLoading, setIsLoading] = React.useState(true);
const…
Pioter
- 465
- 3
- 8
- 21
0
votes
1 answer
Is it possible to hide the bottom tab bar upon a button press and then draw it up when necessary by a simple touch?
Hey their fellow stack over flowers!
As the question states, is it possible to perform such a feat?
If possible how would you go about doing it?
So the situation we have here is that there is a drawer and on top of it lies the bottom tab bar which…
On the way to success
- 200
- 2
- 12
0
votes
1 answer
How to send props from createBottomTabNavigation to every tab screen?
I am using createBottomTabNavigation and I have 4 screens which I can access by pressing the tab bar screen in the bottom of my screen. I am also using Stack Navigation to display the title of the screen there and also all screens have the same…
Fiphe
- 320
- 3
- 18
0
votes
2 answers
Always show BottomTabNavigation
How can I show BottomTabNavigation even on stacked screen? I have tried this for a few hours but really don't get it to work as expected.
So the thing I want to happen is, if I navigate to say for example the Title Screen, I still want to show the…
Mikael Blytung
- 45
- 7
0
votes
1 answer
How to keep track of screen title when bottom navigation is used in react native?
I am making use of bottom navigation in React Native and I have a header which is supposed to show on which screen I am at the moment. I am not sure how to change that text on Tab Bar press. I tried making use of onPress event but seems like it does…
Fiphe
- 320
- 3
- 18
0
votes
1 answer
how can i mock createBottomTabNavigator from @react-navigation/bottom-tabs in Jest
I can't seem to be able to test my bottom navigator with Jest.
here's my navigator :
import * as React from 'react';
import 'react-native-gesture-handler';
import Icon from 'react-native-vector-icons/FontAwesome';
import IonIcon from…
Chafik Chaabane
- 27
- 2
- 8
0
votes
1 answer
Issue with React Navigation 5: Bottom tab navigator not rendering correctly showing a small box with a shadow
So Im using @react-navigation/bottom-tabs to create a simple bottom tab navigator between two screens and im getting this weird look:
emulator screenshot
Im using a very simple example, here's the code for my first and second screen:
const…
abdou-tech
- 687
- 1
- 8
- 16
0
votes
1 answer
I can't hide the tabbar completely, the add button in the middle will show
when I hide the tabbar using tabBarVisible in a specific screen the upper half of the button in the middle will be still visible (above the red line), any ideas how I can hide that also?
I'm using react-navigation v5
const StackNav = (props: any)…
user00001
- 71
- 8