web-dev-qa-db-fra.com

Modifier la couleur d'arrière-plan de l'en-tête de navigation

Luttant pour comprendre comment changer la couleur d'arrière-plan de la barre d'en-tête de navigation. J'utilise React Navigation et Expo pour créer mon application.

backgroundColor ne semble rien faire. Une idée de comment faire ça?

Mon code est ci-dessous:

static navigationOptions = () => ({
    title: 'My App',
    headerTintColor: Colors.DarkBlue,
    backgroundColor: 'red',
    headerLeft:
      <HeaderBarItem to='InfoScreen' title='App info' />,
    headerRight:
      <HeaderBarItem to='FeedbackScreen' title='Feedback' />
  });
react-nativereact-navigationexpo
10
Led

Cela devrait fonctionner:

static navigationOptions = () => ({
    title: 'My App',
    headerTintColor: Colors.DarkBlue,
    headerStyle: {
      backgroundColor: 'red'
    },
    headerLeft:
      <HeaderBarItem to='InfoScreen' title='App info' />,
    headerRight:
      <HeaderBarItem to='FeedbackScreen' title='Feedback' />
  });
18
Aakash Sigdel

Collez ceci dans votre écran cible

static navigationOptions = ({ navigation }) => {
   return {
      title: 'Screen Title',
      headerTintColor: 'royalblue',
      headerStyle: {
         backgroundColor: '#fff'
      }
   }
}
5
Pheng Sengvuthy

Vous pouvez simplement utiliser à l'intérieur de votre composant de vue

<StatusBar backgroundColor = '#fff' />

Cela a fonctionné pour moi sur Android

N'oubliez pas d'importer StatusBar de 'react-native' bien sûr

0
AlwaysConfused