v6 hiding tabbar with {display:none} does not work on iOS

Current behavior

(I am opening this issue here because it is said that this issue might be related to this library I have already opened the issue in the react-navigation repo)

I am trying to achieve dynamically hiding tab bar behavior. I already know what documentation suggest for this purpose.

However, I am not a big fan of restructuring whole navigators and routes for only hiding tab bar. Thus, I did prefer a more dynamic way. But, I am facing a problem with IOS simulator/real device. It works fine on android devices.

What I do is basically, (just a summary of the logic I do app

  <BottomTabBar
    style={{ display: shouldRenderTabBar ? "flex" : "none" }}
    {...props}
  />;

And this is what happens on ios simulator/real-device. Video link

Seems like display:none doesn’t affect anyway to height of bottom tab bar. I am wondering while it works on android emulator/real-device what’s wrong with IOS?

Expected behavior

Hide bottom tab bar with the applied styling

Reproduction

https://snack.expo.dev/@tarikfp/hide-bottom-bar-fails-on-ios

https://user-images.githubusercontent.com/61876765/159287071-b9b4cf09-9998-414d-9ded-bb25b2ae76e0.mov

Platform

• Android
• iOS
• Web
• Windows
• MacOS

Packages

• @react-navigation/bottom-tabs
• @react-navigation/drawer
• @react-navigation/material-bottom-tabs
• @react-navigation/material-top-tabs
• @react-navigation/stack
• @react-navigation/native-stack

Environment

• [] I’ve removed the packages that I don’t use

package	version
@react-navigation/native	6.0.6
@react-navigation/bottom-tabs	6.1.0
@react-navigation/native-stack	6.2.5
react-native-safe-area-context	3.3.2
react-native-screens	3.9.0
react-native-gesture-handler	1.10.3
react-native	0.66.3

[tarikpnr]

@hirbod Yes, I use native-stack as well. Some says that it might also be related to react-native version. In expo snack you wont see this error.

I really would like to have a prop for tabBarVisible as it used to be before… But apparently, it seems not possible from what I can see.

[wibb36]

exactly, a prop more like tabBarHide is a must. does anyone know how tabBarHideOnKeyboard works?