react-native - Combining bottom navigator and top navigator

Question

The AppNavigator and TopBarNavigator should be displayed all the time on the app. The problem is that I can't get the topbarnav to show up without adding it to the appNavigator. The problem with that is that it adds an extra tab, which I don't want at the bottom.

const AppNavigator = createBottomTabNavigator(
    {
      Insights: {screen: Insights},

      Incidents: {screen: googleMapsImages},

      Plus: {screen: Addhazard},

      'Team alerts': {screen: TeamAlerts},

      More: {screen: Main},
    },{
    tabBarOptions: {
      activeTintColor: 'green',
      inactiveTintColor: 'gray',
    },
  }
);

const Drawernavigator = createDrawerNavigator(
  {
    BottomNavigator: {screen: AppNavigator},
    Team: {screen: YourTeam},
  }
);

const AppContainer = createAppContainer(Drawernavigator);
class App extends Component {
  render(){
   return (
          <View style={styles.container}>
            <AppContainer />
          </View>
            );
      }
    }

A good example is the app you can download here --> https://safetyculture.com/spotlight/

标签： react-nativereact-navigation