Skip to content

fix(Android, FormSheet v4): Prevent FormSheet over-translation on keyboard appear in nested containers#4240

Merged
t0maboro merged 3 commits into
mainfrom
@t0maboro/adjust-formsheet-keyboard-offset-in-nested-container
Jul 1, 2026
Merged

fix(Android, FormSheet v4): Prevent FormSheet over-translation on keyboard appear in nested containers#4240
t0maboro merged 3 commits into
mainfrom
@t0maboro/adjust-formsheet-keyboard-offset-in-nested-container

Conversation

@t0maboro

@t0maboro t0maboro commented Jun 30, 2026

Copy link
Copy Markdown
Contributor

Description

When a FormSheet is presented from a container that does not reach the absolute bottom of the screen (e.g., a stack nested inside bottom tabs), opening the keyboard causes the sheet to translate too far up.

This happens because SheetAnimationCoordinator previously assumed the sheet's container always starts at the absolute bottom of the window. It applied the full, raw IME inset height to translationY. As a result, a visible gap appeared between the keyboard and the bottom of the sheet.

Instead of applying the raw keyboard height, we now calculate the effectiveKeyboardHeight by subtracting the space below the sheet's container from the raw IME inset.

Changes

  • use getGlobalVisibleRect to find the absolute position of the container's bottom and subtract it from the root view's height.
  • calculate and cache the offset only when necessary: inside onAnimationStart and notifyKeyboardAnimationStart.

Warning

While debugging, I noticed another related issue in SheetDelegate. When the IME becomes visible, the delegate intercepts the insets (currently from DecorView) and explicitly zeroes out the bottom system bar (navigation bar) inset for the entire hierarchy https://github.com/software-mansion/react-native-screens/blob/4.25.2/android/src/main/java/com/swmansion/rnscreens/bottomsheet/SheetDelegate.kt#L376-L389
As a result, the moment the keyboard starts sliding up, every screen receives a 0 navigation bar inset. This causes the screen's layout height to instantly increase, leading to a noticeable visual jump in its content. We should address this in a follow-up, as it seems like the FormSheet delegate shouldn't inappropriately modify or consume the navigation bar insets for the rest of the view tree.

Fixed in a followup PR: #4244

Before & after - visual documentation

Before After
before.mov
after.mov

Test plan

Adding dedicated issue test in this PR

Checklist

  • Included code example that can be used to test this change.
  • For visual changes, included screenshots / GIFs / recordings documenting the change.
  • For API changes, updated relevant public types.
  • Ensured that CI passes

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Fixes Android FormSheet keyboard-driven translation when the sheet is presented from a container that doesn’t reach the bottom of the window (e.g., stack nested in bottom tabs) by adjusting the applied IME inset to account for the container’s bottom gap.

Changes:

  • Compute an effectiveKeyboardHeight by subtracting the “empty space below the screen container” from the raw IME bottom inset.
  • Cache/update the container-bottom offset at animation start and keyboard animation start (instead of assuming the container always reaches the window bottom).
  • Add a new issue-test scenario intended to reproduce the nested-container FormSheet + keyboard case.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File Description
apps/src/tests/issue-tests/TestXXXX.tsx Adds a regression test scenario for FormSheet presented from a nested container with keyboard interaction.
apps/src/tests/issue-tests/index.ts Registers the new issue test export.
android/src/main/java/com/swmansion/rnscreens/bottomsheet/SheetAnimationCoordinator.kt Adjusts sheet translation logic to use container-relative effective keyboard height and caches container bottom offset.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread apps/src/tests/issue-tests/index.ts
@t0maboro t0maboro changed the title fix(Android, FormSheet): Prevent FormSheet over-translation on keyboard appear in nested containers fix(Android, FormSheet v4): Prevent FormSheet over-translation on keyboard appear in nested containers Jul 1, 2026
@t0maboro t0maboro merged commit 77314c2 into main Jul 1, 2026
5 checks passed
@t0maboro t0maboro deleted the @t0maboro/adjust-formsheet-keyboard-offset-in-nested-container branch July 1, 2026 13:27
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.

3 participants