In Landscope mode, immersion does not work.

[pk936]

When user changes the orientation to landscape, the navigation bar does not disappear.

It works only in portrait mode.

  const mode = useOrientation();

 const setImmer = async() => {
    const result = await SystemNavigationBar.immersive(); // does not work in landscape
  }

useEffect(() => {
   if(mode === 'LANDSCAPE'){
      setTimeout(setImmer, 2000 )
    }
  }, [mode]);

[liquidvisual]

In landscape mode, hide doesn't work either.

[kadiraydinli]

Hey @pk936 @liquidvisual, which Android version are you experiencing this issue on? I checked on Android 11 and 12. It works fine.

[pk936]

@kadiraydinli Did you try my code as I mentioned ? After you rotate your device, the immersion mode should be activated after 2 seconds. automatically.

[kadiraydinli]

@pk936 Yes, I tried the same way.

video.mov

[LouieTian0209]

I can confirm that navigationHide isn't working in landscape mode with API 30. I'm still seeing the navigation bar after calling navigationHide with my app that's locked in landscape mode. Upon debugging it seems that this promise is returning an error. I have the following code:

SystemNavigationBar.navigationHide().then(res => {
	console.log('Code reached res section, ' + res);
}, err => {
	console.log('Code reached err section, ' + err);
});

And the output I get from the console is:

Code reached err section, TypeError: null is not an object (evaluating 'NavigationBar.navigationHide')

I did dig in and see you are using NativeModules.NavigationBar to access the navigation bar, and when I tried

NativeModules.NavigationBar.navigationHide();

I got the following error:

TypeError: null is not an object (evaluating '_reactNative.NativeModules.NavigationBar.navigationHide')

And when I tried console.log(NativeModules.NavigationBar), I got null.
I'm not familiar with neither native Android nor React Native low level code, so I'm guessing something is going wrong when you're trying to access the NavigationBar property that caused the error?

[MwareSolutons]

I want to add to this, for us its also not working on a Samsung Tablet Android 12. The bar disappears but the screen height is not adjusted there is now a grey area where the bar used to be.

[kadiraydinli]

I made changes for this issue, you can find it in the latest version.

[AlejandroAguilar99]

I want to add to this, for us its also not working on a Samsung Tablet Android 12. The bar disappears but the screen height is not adjusted there is now a grey area where the bar used to be.

Hey! did you managed to make the grey area disappear? I'm having the same issue on Android 9

[kadiraydinli]

I want to add to this, for us its also not working on a Samsung Tablet Android 12. The bar disappears but the screen height is not adjusted there is now a grey area where the bar used to be.

Hey! did you managed to make the grey area disappear? I'm having the same issue on Android 9

Hi @AlejandroAguilar99, I have released a new version. I think it will solve your issue. Can you use the latest version and test it?

[AlejandroAguilar99]

I want to add to this, for us its also not working on a Samsung Tablet Android 12. The bar disappears but the screen height is not adjusted there is now a grey area where the bar used to be.

Hey! did you managed to make the grey area disappear? I'm having the same issue on Android 9

Hi @AlejandroAguilar99, I have released a new version. I think it will solve your issue. Can you use the latest version and test it?

Thanks, but unfortunately it's still not working :/

[kadiraydinli]

@AlejandroAguilar99 What device are you testing? I can test mostly with Android emulators. I don't encounter this issue when I test it on emulators. Therefore, it becomes more difficult to solve the problem. I would be very grateful if you could share something like a sample snack for me. I want to test it in the same ambient conditions as I can. Thanks in advance.

[AlejandroAguilar99]

@AlejandroAguilar99 What device are you testing? I can test mostly with Android emulators. I don't encounter this issue when I test it on emulators. Therefore, it becomes more difficult to solve the problem. I would be very grateful if you could share something like a sample snack for me. I want to test it in the same ambient conditions as I can. Thanks in advance.

Sorry for not letting you know before, the problem was the width of the component, since I assigned the window dimension instead of the screen dimension, it works perfectly now