Estoy usando react-navigation.
Estoy usando createStackNavigator dentro de createBottomTabNavigator.

Quiero ocultar la barra de pestañas para SignInScreen que está dentro de AccountTab pero no funciona.

export default createBottomTabNavigator({
    HomeTab: { screen: createStackNavigator ({
      HomeTabScreen     : { screen:HomeTabScreen },
      ProductScreen     : { screen:ProductScreen },
    }),
      initialRouteName: 'HomeTabScreen',
    },

    AccountTab: { screen: createStackNavigator ({
      AccountTabScreen  : { screen:AccountTabScreen },
      RegisterScreen    : { screen:RegisterScreen },
      SignInScreen      : { screen:SignInScreen },
    }),
      initialRouteName: 'AccountTabScreen',
    },

  },
    {
        initialRouteName: 'HomeTab',        
        navigationOptions: ({ navigation }) => ({
            tabBarLabel: ({ focused, tintColor }) => {
                const { routeName } = navigation.state;
                let name;
                if (routeName === 'HomeTab') {
                  name = "Home";
                } else {
                  name = "Account";
                }
                return <Text style={[styles.titleStyle, focused ? styles.titleSelectedStyle : {}]}>{name}</Text>;
            },
        }),
});

Estoy probando tres métodos pero no funciona.
los métodos están siguiendo

1) Me aplicaron tabBarVisible: false en el código anterior para que oculte la barra de pestañas para toda la pantalla.

2) Me aplicaron la función para tabBarVisible como función tabBarLabel en el código anterior.

3) Me aplicaron tabBarVisible: false en navigationOptions dentro de SignInScreen .

¿Cómo ocultar la barra de pestañas de SignInScreen ?

0
Bhaumik Surani 8 sep. 2018 a las 14:34

3 respuestas

La mejor respuesta

Hay un hilo de git que podría ayudarte: https://github.com/react-navigation/ react-navigation-tabs / issues / 19 # issuecomment-410857516

Básicamente, debería intentar cambiar las opciones de navegación de su AccountTab de esta manera:

AccountTab: { 
  screen: createStackNavigator ({
        AccountTabScreen  : { screen:AccountTabScreen },
        RegisterScreen    : { screen:RegisterScreen },
        SignInScreen      : { screen:SignInScreen },
  }),
  initialRouteName: 'AccountTabScreen',
  navigationOptions: ({navigation}) => {
    let { routeName } = navigation.state.routes[navigation.state.index];
    let navigationOptions = {};

    if (routeName === 'SignInScreen') {
        navigationOptions.tabBarVisible = false;
    }

    return navigationOptions;
  }
},
2
needsleep 8 sep. 2018 a las 16:36
const NestedNavigator = StackNavigator({
    ScreenOne: {
        screen: ScreenOneComponent
    },
    ScreenTwo: {
        screen: ScreenTwoComponent
    }
});

class NestedNavigatorWrapper extends React.Component {
    constructor(props)  {
        super(props);
    }
    render() {
        return (
            <DashboardNavigator screenProps={{ rootNavigation: this.props.navigation }} />
        );
    }
}
const AppNavigator = StackNavigator({
    Home: {
        screen: HomeComponent
    },
    Nested: {
        screen: NestedNavigatorWrapper
    }
});
0
Ganesh Khartode 8 sep. 2018 a las 12:29

Si desea ocultar tabNavigation en la pantalla2 (parte de StackNavigator entonces,

navigationOptions: ({navigation}) => {
      let {routeName} = navigation.state.routes[navigation.state.index];
      let navigationOptions = {};
      console.log('Route Name=' + JSON.stringify(routeName));

      if (routeName === 'Screen') {
        navigationOptions.tabBarVisible = false;
      }

      return navigationOptions;
0
Pavan 9 feb. 2020 a las 18:31