HomeIndicator hide not working with new navigation

[MaxJadav]

"@react-navigation/native": "^6.0.11", "@react-navigation/native-stack": "^6.7.0", "react-native-home-indicator": "^0.2.9", "react-native-safe-area-context": "^4.3.1", "react-native-screens": "^3.15.0",`` "react": "18.0.0", "react-native": "0.69.4",

import { View } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { HomeIndicator } from 'react-native-home-indicator';

function HomeScreen() {
  return (
    <View>
      <HomeIndicator autoHidden />
    </View>
  );
}
const Stack = createNativeStackNavigator();
export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

[michaelknoch]

It's kinda expected behaviour that this library does not work when using native navigators because we only set the home indicator preference on the root navigator. Your app may render other child navigators which have their own home indicator preference which has higher priority than the global one (this is just how iOS works).

If you are on the latest version of react-navigation you can use the autoHideHomeIndicator prop on the navigator instead.

@MaxJadav