React Native createDrawerNavigator avec en-tête / barre d'action

Question

J'ai implémenté un tiroir de navigation, mais je ne peux pas afficher l'en-tête/la barre d'actions

const RootStack = createDrawerNavigator(
  {
    Home: HomeScreen,
    Details: DetailsScreen,
  },
  {
    intialRouteName: 'Home',
    navigationOptions: {
      headerStyle : {
        backgroundColor: '#f4511e',
      },
      headerTintColor: '#fff',
      headerTitleStyle : {
        color: 'white',
      },
    },
  }
);


export default class App extends React.Component {
  render() {
    return <RootStack/>;
  }
}

Existe-t-il un moyen d'utiliser la navigation dans les tiroirs ainsi qu'une barre d'en-tête?

Answer 1

Votre RootStack (tiroir) doit être à l'intérieur d'un StackNavigator,

const RootStack = createDrawerNavigator(
{
  Home: HomeScreen,
  Details: DetailsScreen,
},
{
intialRouteName: 'Home',
navigationOptions: {
  headerStyle : {
    backgroundColor: '#f4511e',
  },
  headerTintColor: '#fff',
  headerTitleStyle : {
    color: 'white',
    },
   },
 }
);

const AppStack = StackNavigator({ RootStack : { screen: RootStack } });

export default class App extends React.Component {
  render() {
    return <AppStack/>;
  }
}

Plus d'informations ici .