okwasniewski / react-native-bottom-tabs

Native Bottom Tabs for React Native
https://www.npmjs.com/package/react-native-bottom-tabs
MIT License
284 stars 9 forks source link

Fix/bottom safe area #37

Closed okwasniewski closed 19 hours ago

okwasniewski commented 4 days ago

This PR fixes bottom safe area handling by measuring the tab bar on the native side and offsetting it in JS.

https://github.com/user-attachments/assets/5973256f-26b9-46aa-94a8-2c420a468517

okwasniewski commented 4 days ago

cc @dylancom let me know what you think 👍🏻

dylancom commented 4 days ago

In order to make the blurring background on the tabbar work style={{ overflow: visible }} needs to be set on the scrollviews. Or do you know a better solution?

Simulator Screenshot - iPhone 16 Pro - 2024-10-11 at 15 51 05
dylancom commented 3 days ago

Great work!

okwasniewski commented 3 days ago

Hey @dylancom I finally figured it out!!

Now its working with the built-in behavior 🚀 Scroll views are automatically inseted.

https://github.com/user-attachments/assets/76082f3a-e0c9-4e2e-b8f9-4f14f395c099

dylancom commented 2 days ago

Clever find!! Awesome.

dylancom commented 2 days ago

Some bugs while testing on my end. The scrollbar starts too late in the top and on reaching the end some content is still below the tabbar.

dylancom commented 19 hours ago

If I test the example app in the latest main the content still ends below the tabbar on my end.

ferrannp commented 17 hours ago

@okwasniewski I just tried this and the issue still persists. Do you have a working example?