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
3
votes
1 answer

Navigation icons are disappearing when accessing stack pages in react native

I am using react navigation (https://reactnavigation.org/) to display icons for the bottom navigation tabs. Icons are displaying fine, however, when I enter into pages in the stack, the icons disappear. I can get the icons to show by referring to…
Colin Sygiel
  • 917
  • 6
  • 18
  • 29
3
votes
0 answers

React Navigation Hot reload not working

I started to refactor my entire react native navigation with react-navigation and now its working fine, but only thing is now app doesn't support for hot reloading. Every time I save a file that related to route. It give me an hot reload error:…
TIJ
  • 2,771
  • 3
  • 19
  • 32
3
votes
0 answers

React Native - Stack Navigator, close multiple views

i'm trying to close multiple view in a Stack Navigator without ugly animation. The app structure is like this : Tab navigator : Screen 1 Screen 2 Screen 3 StackNavigator : Tab navigator(routeName : Home) => Registration View => Login View Screen…
DerMth
  • 71
  • 8
3
votes
6 answers

Hide header inside DrawerNavigator (react-navigation)

Hye.. I currently playing around react-navigation and trying to solve issue where header did not hide when Drawer open... I hope anyone can share how to solve this buggy header..below I attached my code integration of DrawerNavigator inside…
Hazim Ali
  • 1,077
  • 4
  • 17
  • 28
3
votes
1 answer

React Native - React Navigation show header and footer on every page

Hi I'm using this package for my navigation: https://github.com/react-community/react-navigation First of all here is my code: export default MainNavigator = StackNavigator( { header: { screen:…
ssuhat
  • 7,387
  • 18
  • 61
  • 116
3
votes
2 answers

In react-navigation TabNavigator, how to setParams

const AppTabs = TabNavigator({ Home: { screen: FilmList, }, FilmCinemaList: { screen: FilmCinemaList, path: 'cart', }, FilmGoodsList: { screen: FilmGoodsList, }, FilmMe: { screen: FilmMe, }, }) when I click FilmCinemaList, i wanna…
Ann
  • 41
  • 4
3
votes
1 answer

react-navigation dynamic header doesn't work?

I followed exactly the tutorial https://reactnavigation.org/docs/intro/ But the header does not show up. Here is the code and the result import Expo from 'expo'; import React from 'react'; import { StyleSheet, Text, View, Button } from…
John
  • 3,888
  • 11
  • 46
  • 84
3
votes
1 answer

React-navigation TabNavigator with redux errors

I'm trying to implement the TabNavigator of react-navigation with redux but I keep running into errors. I'm now getting the following error: undefined is not an object (evaluating 'navigation.state.routes') My index.android.js and index.ios.js are…
Tripwire
  • 198
  • 2
  • 11
3
votes
1 answer

TabNavigator: Style tab label based on target platform

I'm using react-native TabNavigator to navigate between tabs in my application. const TabNav = TabNavigator({ Home: { screen: HomeScene, navigationOptions:{ tabBar: { label: 'Home', …
Nick
  • 19,198
  • 51
  • 185
  • 312
3
votes
1 answer

Custom close button inside the header of StackNavigator of React Navigation

I'm currently working with React Native and there I've got a question about React Navigation and the StackNavigator. I would like to add a custom close button to the header, but I'm not sure how to do this. It's just possible for me to navigate to…
Daniel
  • 1,999
  • 4
  • 15
  • 27
3
votes
0 answers

stop audio when navigating in react native

I have an app that uses React navigation to navigate, and in my app I made an audioplayer component that uses React Native Sound. My question is, how can I stop the audio when the user navigates to another view? I've found the function…
Niels
  • 1,340
  • 2
  • 15
  • 32
3
votes
2 answers

React Native's React-Navigation: Adding a badge in TabNavigator's Tab

In React-Native with React-Navigation I have a Tabnavigator like so: const testScreenNavigator = TabNavigator({ Tab1: { screen: Tab1Screen }, Tab2: { screen: Tab2Screen }, Tab3: { screen: Tab3Screen…
user3819370
  • 513
  • 1
  • 6
  • 15
2
votes
3 answers

Header and BottomTabNavigator gets double height when reloading in React-Native

I have been struggling with this for days now and can't find a solution so all help is welcome. When reloading the app my BottomTabBar as well as the Header gets increased height. When the app has finished reloading it goes to normal, but this…
2
votes
0 answers

loading overlay close before navigation

why does iOS reset the overlay when navigating and only after this goes to another screen why does iOS reset the overlay when navigating and only after this goes to another screen how to fix this bug in reit native, 1 overlay starts 2 an api request…
Alex
  • 89
  • 1
  • 8
2
votes
1 answer

An issue about nested navigator in Expo Router

I am encountering an issue related to navigating in Expo Router. image of my project's navigator hierarchy As shown in the screenshot above, I have configured my router in the following way. I defined the Stack Navigator in app/_layout.tsx, the Tabs…
smins
  • 31
  • 2