lodev09 / react-native-true-sheet

The true native bottom sheet experience 💩
https://sheet.lodev09.com
MIT License
394 stars 12 forks source link

[bug] inconsistent handling elements outside scrollview element ( mainly headers that don't scroll ). #49

Closed a-eid closed 2 months ago

a-eid commented 2 months ago

scrollviews seem to extends the full width of the sheet on IOS ( kinda like it's absolutely positioned ), however it's not the case on android which avoids the element.

Screenshot 2024-06-30 at 2 04 59 PM

lodev09 commented 2 months ago

That's correct. IOS handles the height manually like a position: absolute style. On android, it's not handled at all since it works as is (only need the nestedScrollEnabled enabled).

The only consistent solution moving forward is to create a HeaderComponent so IOS will account for it when resizing, thus making both platform consistent.

For now, you can use Platform.select() and add padding to the scroll view.

lodev09 commented 2 months ago

You could also float your header to make them consistent on both platform. I think that was the reason I did not add that HeaderComponent prop 😅

a-eid commented 2 months ago

@lodev09 Yeah that's what I'm already doing. I have a couple more inconsistencies

1- android sheet seem to change colors on dark / light modes on IOS it does not. 2- the footer component on IOS dismisses with the sheet in a linear manner, which is not the case on android there seem to be some sort of interpolation.

do you think they could be raised as bugs, I'll check the source code and try to contribute.

lodev09 commented 2 months ago

I hate to admit it but the footer workflow on android is kinda hacky. I wish android has a straightforward way of handling all this like in IOS. It was a pain tbh.

If you could improve it, feel free to open a PR 🙏

a-eid commented 2 months ago

@lodev09

android generally is unfortunately

did you see the case where android responds to dark mode / light mode changes, but IOS doesn't ?