如何在 React Native 中更改 NavigationContainer 的背景颜色？

Question

反应本机

我有 NavigationContainer，我想将背景颜色更改为黑色。

我先做

<NavigationContainer style={{ backgroundColor: 'black' }}>

其次是下面的代码

import React from 'react';
import { NavigationContainer, DefaultTheme } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import First from './components/first'; // Import the First component
import Login from './components/login'; // Import the Login component

const Stack = createStackNavigator();

const stackNavigatorOptions = {
  defaultNavigationOptions: {
    headerStyle: {
      backgroundColor: 'black',
    },
  },
};

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="First" screenOptions={stackNavigatorOptions}>
        <Stack.Screen name="First" component={First} />
        <Stack.Screen name="Login" component={Login} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

我希望将 NavigationContainer 颜色从白色更改为黑色。

Answer 1

谢谢大家，我找到了更改 NavigationContainer 背景颜色的解决方案。

    <Stack.Screen options={{
      title: 'My home',
      headerStyle: {
        backgroundColor: '#f4511e',
      },
    }} name="First" component={First} />