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

[abtonc]

Please verify the following:

• [x] yarn test jest tests pass with new tests, if relevant
• [x] 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]

Will be testing this tomorrow, thanks for the contribution!

[frankcalise]

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

[abtonc]

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

https://github.com/infinitered/ignite/assets/62848063/f94184d5-e103-47d2-ad62-97b604629200

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.

[fpena]

Hello @abtonc!

Thanks for creating this PR, and I'm sorry it took us so long to reply.

We're currently working on a more generic solution to this problem. I created the following PR.

For that reason, I'll be closing this one in favor of the other. We're planning to merge it into the next release branch (v10) and release it soon.

Thanks again for your contribution!