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

Android input issue where bottom sheet moves upon keyboard opening #68

Closed
hannojg opened this issue Nov 18, 2020 · 4 comments
Closed

Android input issue where bottom sheet moves upon keyboard opening #68

hannojg opened this issue Nov 18, 2020 · 4 comments
Labels
bug Something isn't working no-issue-activity v2 Written in Reanimated v1

Comments

@hannojg
Copy link

hannojg commented Nov 18, 2020

Bug

Through these styles:
src/components/BottomSheet/styles.ts

  container: {
    position: 'absolute',
    left: 0,
    right: 0,
    bottom: 0,
  }

it happens that when opening the Keyboard on android (e.g. having a text input in the bottom sheet's content) the content gets pushed up:
BOTTOM

This is the default behaviour on android. Interestingly, this doesn't happen when changing the styles from bottom -> top.

  container: {
    position: 'absolute',
    left: 0,
    right: 0,
    top: 0,
  }

TOP

However, this breaks the BottomSheet, as all calculations are thought to be run from the bottom edge.
I am aware that it is possible to change on android the windowSoftInputMode, however, this is quite invasive and doesn't work with projects using react native navigation.

Environment info

Library Version
@gorhom/bottom-sheet 1.4.1
react-native 0.63.3
react-native-reanimated 2.0.0-alpha.8
react-native-gesture-handler 1.8.0

Reproducible sample code

Please tell me whether reproduction is necessary.

@hannojg hannojg added the bug Something isn't working label Nov 18, 2020
@gorhom gorhom added the v2 Written in Reanimated v1 label Nov 27, 2020
@gorhom
Copy link
Owner

gorhom commented Nov 27, 2020

thanks @hannojg for submitting this issue.

this already been resolved with #81, I have refactored the sheet styling to use top instead bottom.

it will be released with v2 soon 👍

@danielmark0116
Copy link

To anybody who has issues with this (active keyboard moving the modal up), you can try to programmatically switch softInputMode to adjustNothing by writing a native module on a screen where you want to use the bottom sheet. Note that none keyboard events will be sent to the RN though

I am aware that it is possible to change on android the windowSoftInputMode, however, this is quite invasive and doesn't work with projects using react native navigation.

@github-actions
Copy link

github-actions bot commented Jul 5, 2021

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

@github-actions
Copy link

This issue was closed because it has been stalled for 5 days with no activity.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working no-issue-activity v2 Written in Reanimated v1
Projects
None yet
Development

No branches or pull requests

3 participants