I am setting the theme of my Navigation Container like this
import {
  NavigationContainer,
  DefaultTheme,
  DarkTheme,
} from "@react-navigation/native";
export default function Navigation() {
  const colorScheme = useColorScheme();
  return (
    <NavigationContainer
      linking={LinkingConfiguration}
      theme={colorScheme === "dark" ? DarkTheme : DefaultTheme}
    >
      <RootNavigator />
    </NavigationContainer>
  );
}
I have a stack navigator, and inside the stack navigator i have a drawer navigator, like this:
// Root Navigator
export default function RootNavigator() {
  return (
    <Stack.Navigator id="root-navigation-navigator" initialRouteName={initialRouteName}>
      <Stack.Screen
        name="Root"
        component={DrawerNavigator}
        options={{
          headerShown: false,
        }}
      />
      {/* Other Screens */}
    </Stack.Navigator>
  );
}
// Drawer Navigator
export default function DrawerNavigator(props) {
  return (
    <Drawer.Navigator
      initialRouteName="UserSettings"
      drawerContent={(props) => <CustomDrawerContent {...props} me={me} />}
    >
      {/* Some Screens */}
    </Drawer.Navigator>
}
The Drawer Toggle Button
In default browser theme it looks like this:
In dark theme it looks like this:
How can I get the toggle button to contract the black of dark theme?!
Thanks in advance.


