Hiding the bottom navigation bar on Android creates a gap at the bottom of the view

[daveyjones]

🐛 Bug Report

When the navigation bar is set to visible: false (as described here), it still takes up space. Nothing is able to render in the gap.

Have you read the Contributing Guidelines on issues?

Yes.

To Reproduce

1. Clone the demo (link below)
2. cd navigation-bar-demo
3. yarn install
4. react-native run-android

If the blue background doesn't appear on the first run, you may need to run react-native run-android a second time.

Expected behavior

The blue background should extend all the way to the bottom of the view.

Actual Behavior

The blue background stops where the navigation bar would be if it were visible.

Your Environment

• React Native Navigation version: 7.17.1
• React Native version: 0.64.2
• Platform(s) (iOS, Android, or both?): Android
• Device info (Simulator/Device? OS version? Debug/Release?): Android 11 on Pixel 4 Emulator

Reproducible Demo

https://github.com/dillpixel/navigation-bar-demo

[swabbass]

Hey, thanks for the report, we are testing react-native-navigation with ReactNative 0.64, soon it will be ready, for now, can you kindly verify that this issue does not happen on ReactNative 0.63? (the version we support for now).

[phuongwd]

@swabbass just confirm, it's happening on RN@0.63.4 and RNN@7.18.1.
I have to use layout.backgroundColor for temporary fix

[bertrand-caron]

Hi, is anyone working on this? I am seeing the same issue on RN@0.65.0 and RNN@7.22.3.

Thank you :)

[swabbass]

Hey, We are doing a migration to RN 66 it will include Fixes for such cases, please follow #7305.

[MagnusEklof]

Just a note here, hiding the navigation bar works in the playground app because there you have bottomtabs and if you have bottomtabs visible and then do mergeOptions to set visibility to false for navigationBar then it works fine, no space is left and bar is completely gone. If you do not have any bottomtabs then you get the problem in this bug report. I have experimented with https://github.com/dillpixel/navigation-bar-demo to find a workaround and can push a branch if needed that show when it works.