Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to limit max expanded height? #322

Closed
z1haze opened this issue Nov 29, 2023 · 9 comments · Fixed by #330
Closed

How to limit max expanded height? #322

z1haze opened this issue Nov 29, 2023 · 9 comments · Fixed by #330

Comments

@z1haze
Copy link

z1haze commented Nov 29, 2023

How do you prevent a sheet from going beyond a max height or snap point? I have tried setting a snap point to 75 for example, but it will allow me to expand it even further, if there is content in the view large enough. The preference would be to set a limit for the max height and have the scroll view handle the overflow.

Here is an example of difference in functionality between platforms. We do not like the ios behavior of how it will up into the status bar. it should behave like android does
image

@YeeWan0217
Copy link

have same problem too

@justinmwarner
Copy link

Not sure if you tried, but passing in snapPoints={[80]} sets the height to 80%. This works on my end at least.

@YeeWan0217
Copy link

@justinmwarner Thank you for the solution, my solution is set the style of ScrollView in ActionSheet with maxHeight: Platform.OS == 'ios' ? Dimensions.get('window').height * 0.3 : Dimensions.get('window').height * 0.4,. But I do like your solution.

@eisodev
Copy link

eisodev commented Jan 25, 2024

https://rnas.vercel.app/guides/safearea

Isn't the drawUnderStatusbar={false} supposed to solve this problem? That prop does nothing for me it seems.

Version 0.8.21

@ammarahm-ed
Copy link
Owner

This will be fixed in #330

You can set the maxHeight on containerStyle prop btw for now.

@ammarahm-ed ammarahm-ed mentioned this issue Jan 29, 2024
@z1haze
Copy link
Author

z1haze commented Jan 29, 2024

Not sure if you tried, but passing in snapPoints={[80]} sets the height to 80%. This works on my end at least.

Read the op issue. It mentions using snap points and it does not fix the issue. Your test case I imagine does not have enough content in it to see the actual issue...

@ammarahm-ed
Copy link
Owner

Not sure if you tried, but passing in snapPoints={[80]} sets the height to 80%. This works on my end at least.

Read the op issue. It mentions using snap points and it does not fix the issue. Your test case I imagine does not have enough content in it to see the actual issue...

You can't limit max height with snap points, you can however using maxHeight on containerStyle to do it. Snap points are used to snap to a certain section of sheet, the sheet will always open to 100% of its actual height based on the content.

@blazk0
Copy link

blazk0 commented Apr 1, 2024

Using maxHeight to containerStyle doesn't work on version 0.9.3

@leymytel
Copy link

leymytel commented Jun 14, 2024

@blazk0 did you find any solutions or workarounds for this issue?

My workaround is to set the maxHeight like this:

<ActionSheet>
      <View style={{ maxHeight: MAX_SHEET_HEIGHT }}>
         <ScrollView contentContainerStyle={styles.contentContainer}>
             ...
         </ScrollView>
     </View>
</ActionSheet>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants