Скрыть заголовок BottomTabNavigator от StackNavigator в реагирующей навигации - PullRequest
0 голосов
/ 23 ноября 2018

Я пытаюсь скрыть заголовок в BottomTabNavigator, но этот пришел из StackNavigator.Я уже пытался использовать заголовок: null внутри страницы и другими способами, но ничего не работает!

const AppTabNav = createBottomTabNavigator({
  HomeScr:{
    screen:Home,navigationOptions:{tabBarLabel:'Inicio',tabBarIcon: ({tintColor}) => (<Icon name='home' color={tintColor} size={25}/>)}
  },
  Settings:{
  screen:Config,navigationOptions:{ tabBarLabel:'Configurações',tabBarIcon:({ tintColor })=>(<Icon name="settings" color={tintColor} size={25}/>)}
  }

})

const AppStackNavigator = createStackNavigator({
  AppTab:{
    screen:AppTabNav,
    navigationOptions:({navigation}) =>({
     title:'Bem vindo @USER',      
     headerLeft:(
        <TouchableOpacity onPress={() => navigation.toggleDrawer()}>
        <View style={{paddingHorizontal:10}}>
          <Icon name="menu" color='black' size={24}/>
        </View>        
        </TouchableOpacity>)
        })
  }
},{tabBarOptions:{
  activeTintColor:'blue',
  inactiveTintColor:'black'
}})

Это заголовок, который я хочу скрыть, когда нажимаю на configurações в Bottombar

Imagem

Это код файла Config.js

export default class Config extends Component {
  static navigationOptions = { 
    header: null,
    drawerIcon: ({ tintColor }) => ( <Icon name='settings' style={{color:tintColor ,fontSize:24}} />)
    }
  SignOut = async() => {
    AsyncStorage.clear()
    this.props.navigation.navigate('AuthLoading')
  }

    render() {
      return (
          <Container>
          <Header>
            <Left style={{flex:1}}>
            <Icon name="menu" color='black' size={24} onPress={() => this.props.navigation.openDrawer()}/>
            </Left>
            <Body style={{flex: 1,justifyContent: 'center'}}>
              <Title>Configurações</Title>
            </Body>
            <Right style={{flex:1}}/>
          </Header>
          <View style={{flex :1, alignItems:'center', justifyContent:'center'}}>                    
                    <Text>Configurações</Text> 
                    </View> 
        </Container>
      );
  }
}

1 Ответ

0 голосов
/ 23 ноября 2018

Просто добавьте это в свой код компонента, и заголовок будет скрыт

tabBarVisible: false

export default class Config extends Component {
  static navigationOptions = { 
    tabBarVisible: false,
    drawerIcon: ({ tintColor }) => ( <Icon name='settings' style={{color:tintColor ,fontSize:24}} />)
    }
  SignOut = async() => {
    AsyncStorage.clear()
    this.props.navigation.navigate('AuthLoading')
  }

    render() {
      return (
          <Container>
          <Header>
            <Left style={{flex:1}}>
            <Icon name="menu" color='black' size={24} onPress={() => this.props.navigation.openDrawer()}/>
            </Left>
            <Body style={{flex: 1,justifyContent: 'center'}}>
              <Title>Configurações</Title>
            </Body>
            <Right style={{flex:1}}/>
          </Header>
          <View style={{flex :1, alignItems:'center', justifyContent:'center'}}>                    
                    <Text>Configurações</Text> 
                    </View> 
        </Container>
      );
  }
}
...