When the 'setBottomTabBar' hook is used, screens do not have enough bottomMargin so content becomes hidden

[darrylsyms]

When using the navigationApi.setBottomTabBar hook, the bottom area of screens is covered/hidden by the tab bar.

If I use the navigationApi.setScreensWithoutTabBar hook on named screens, those screens will be fine because they no longer depend on the <BottomTabBar/> position.

We’ve established that it’s necessary to wrap the <BottomTabBar> component in a <BlurView> on iOS, to stop the grey box appearing above the tabbar. However the BlurView causes another problem as shown in the photos attached.

It's clear that the content-end is attached to the top of the grey box mentioned. The grey box is smaller than the BottomTabBar, which is why the content becomes hidden beneath the tabbar.

I’ve experimented with the BlurView styling and it’s a step in the right direction, but I haven’t quite figured out how to solve the content position issue. Here’s what I’ve tried…

• 'position: “absolute”' seems to be causing the problem. But it’s necessary otherwise the grey box appears over the content.
• 'bottom: -80’ causes the grey box to overlay the tab bar.
• ‘zIndex: 0’ makes no difference.
• ‘height: 0’ removes the tabbar altogether.
• 'top: DEVICE_HEIGHT - TAB_BAR_HEIGHT’ doesn’t help.

I've found no combination of styles that fix this problem. Please find my code here, line 123 is the BlurView code: https://pastebin.com/raw/USJhs5jk

It appears that the grey box does not respect the added height of the iOS home indicator...

[darrylsyms]

Fixed with latest 1.6.2 setBottomTabBar hook.