search

lodev09 / react-native-true-sheet

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

Resize after content changes on sheet size ["auto"] #7

Closed vslio closed 6 months ago

vslio commented 6 months ago

Hey, Jovanni!

First of all, thank you so much for this 💩, I'm already using it in my app and I absolutely love it! Very performant and clean.

I have a problem I need to solve and I was hoping to get your input. I have a sheet for a password-less login flow. You press a "Sign in with email" Button, it shows a sheet with a TextInput for the Email and a Button that initiates the login flow. Clicking that button displays an OTP TextInput just below the Email TextInput that. Doing that though the sheet doesn't recalculate the content size which was just updated.

Is there a way to force a recalculation?

Thank you!

PS: Attaching screenshots for clarity

IMG_8439 IMG_8440

lodev09 commented 6 months ago

Hey, thanks for the feedback!

Regarding your issue, I updated the example here that you can try: https://github.com/lodev09/react-native-true-sheet/blob/main/example/src/sheets/PromptSheet.tsx

Basically adjust the size on-the-fly. This works great on IOS but there's a catch on Android -- it doesn't work if you only have one size configured :(

I will try to find a better solution tomorrow since auto is kinda funky at this time.

lodev09 commented 6 months ago

Got a proper fix for this! auto will now detect size changes automatically 🎉

The caveat for android still exists due to how the dialog works.. when the dialog is already shown, there's no proper way to adjust the maxHeight :(. Still need a second size for it to adjust properly e.g. ['auto', 'large']

vslio commented 6 months ago

Jovanni, you're amazing - thanks a lot! I will give it a shot later today! :)

As for the android caveat - a small "price" to pay :)