Search code examples
react-nativereact-navigationreact-navigation-stack

How to make screen from tabBarNavigator invisible on TabBar?


I use react-navigation version 3.x. How to make screen from tabBarNavigator invisible on TabBar?

I need to remove main screen from tabBar(it should be invisible) but TabBar must be on main screen.

My screen structure is next:

const AppStackNavigator = createStackNavigator({
    loginFlow: { 
      screen: createStackNavigator({
        intro: { screen: Intro },
        login: { screen: Login },
        registration: { screen: Registration }
      })
    },
    mainFlow: {
      screen: createStackNavigator({

        // settings: { screen: SettingsScreen },
        someTab: { 
          screen: createBottomTabNavigator({
            main: { screen: Home },
            Tab1: { screen: Tab1 },
            Tab2: { screen: Tab2 },
            Tab3: { screen: Tab3 },
            Tab4: { screen: ChatMain }
          })
        }
      })
    }
  });

Solution

  • Actually I just used my own TabBar component. just need to use tabBarComponent properties.