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

fix(boilerplate): add header height calculation to keyboard avoidance #2583

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

abtonc
Copy link

@abtonc abtonc commented Dec 9, 2023

Please verify the following:

  • yarn test jest tests pass with new tests, if relevant
  • README.md has been updated with your changes, if relevant

Describe your PR

Fixes #2351. This bug is caused by react-navigation's header feature. Adding the height of the header to offset fixes the issue. (check this stackoverflow answer)

@frankcalise
Copy link
Contributor

Will be testing this tomorrow, thanks for the contribution!

@frankcalise
Copy link
Contributor

@abtonc would you mind providing some before/after screenshots or video or supply a repo with an example?

@abtonc
Copy link
Author

abtonc commented Dec 14, 2023

Here is a demo video from my current project (I switched to the branch with fix in this pr when refreshing text appeared.).

Simulator.mp4

This page uses ignite's useHeader hook, and the button on the bottom has position: "absolute" and bottom: 16 style properties.

I would love to provide a repo but this is a NDA'd project, so can't post it here. I can give you access to the repo if you can text me on twitter @frankcalise.

Hope this was helpful, let me know if you need anything else.

@abtonc abtonc force-pushed the fix/keyboard-avoiding-with-header branch from 57ccbc8 to 04a2a0b Compare December 14, 2023 11:21
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 this pull request may close these issues.

Bug with Screen component's keyboard avoiding behaviour
2 participants