Skip to content

fix(Android, FormSheet v5): Move the sheet above the keyboard - #4573

Open
t0maboro wants to merge 6 commits into
mainfrom
@t0maboro/formsheet-keyboard-integration-android
Open

fix(Android, FormSheet v5): Move the sheet above the keyboard#4573
t0maboro wants to merge 6 commits into
mainfrom
@t0maboro/formsheet-keyboard-integration-android

Conversation

@t0maboro

@t0maboro t0maboro commented Aug 31, 2026

Copy link
Copy Markdown
Member

Description

FormSheet on Android ignored the software keyboard so far. The sheet should move up its content by the keyboard height following the keyboard animation.

Closes: https://github.com/software-mansion/react-native-screens-labs/issues/1276

Changes

  • FormSheetDimensionsCoordinator tracks the IME inset and resolves the geometry against max(systemBars.bottom, ime.bottom) moving the content above the keyboard/navigation bar
  • The container is capped to the safe area (available - top - bottom), so content taller than the remaining space no longer overflows the sheet surface.
  • FormSheetKeyboardCoordinator was introduced defining our own WindowInsetsAnimationCompat.Callback. It records the sheet's layout top before the keyboard insets are applied, translates the sheet back there once the end-state layout is in place and drives translationY to zero along the keyboard animation. Tracking is enabled by FormSheetPresentationManager only while the sheet rests in PRESENTED, otherwise the enter/exit animators own that translation.

Before & after - visual documentation

Android iOS
keyboard-android.mov
keyboard-ios.mov

Test plan

Added a dedicated SFT (maybe it should be CIT 🤔).

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

@coderabbitai

coderabbitai Bot commented Aug 31, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Team

Run ID: 8dc6b8c9-b9b2-4d9d-b2a9-6e8e00c8a279

📥 Commits

Reviewing files that changed from the base of the PR and between 14bff30 and f7f045a.

📒 Files selected for processing (1)
  • apps/src/tests/single-feature-tests/form-sheet/test-form-sheet-keyboard/scenario.md
🚧 Files skipped from review as they are similar to previous changes (1)
  • apps/src/tests/single-feature-tests/form-sheet/test-form-sheet-keyboard/scenario.md

Included review availability: Your plan provides up to 8 included reviews per hour; 7 remain after this review.


📝 Walkthrough

Walkthrough

Changes

The Android FormSheet implementation now accounts for IME insets, animates keyboard-driven sheet translation, and preserves the current translation during dismissal. A new scenario covers keyboard behavior for detent-based and fitToContents sheets on Android and iOS.

FormSheet keyboard handling

Layer / File(s) Summary
IME inset geometry
android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/coordinator/FormSheetDimensionsCoordinator.kt, android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/model/FormSheetDetents.kt, android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/coordinator/FormSheetBehaviorController.kt
The dimensions coordinator tracks IME insets and uses the maximum bottom or IME inset for geometry. Fit-to-contents calculations clamp content to the safe-area height. KDoc describes keyboard insets.
Keyboard animation and presentation lifecycle
android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/coordinator/FormSheetKeyboardCoordinator.kt, android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/presentation/FormSheetPresentation.kt, android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/presentation/FormSheetPresentationManager.kt, android/src/main/java/com/swmansion/rnscreens/modals/formsheet/native/presentation/FormSheetAnimatorFactory.kt
A keyboard coordinator applies translation during IME animations. Presentation setup and teardown manage the coordinator. Tracking is disabled during dismissal and enabled after presentation. Exit animation starts from the current translation.
Keyboard behavior scenario
apps/src/tests/single-feature-tests/form-sheet/index.ts, apps/src/tests/single-feature-tests/form-sheet/test-form-sheet-keyboard/*
The test app registers a scenario with two-detent and fitToContents sheets. The scenario includes text inputs, dismissal controls, platform metadata, and manual Android and iOS verification steps.

Estimated code review effort: 4 (Complex) | ~45 minutes

Merge Risk: ⚪ Minimal · up to f7f04

The change updates Android FormSheet behavior to move sheet content above the software keyboard during keyboard animations. No concrete merge-blocking risk is identified in the supplied context.

Sequence Diagram(s)

sequenceDiagram
  participant FormSheetPresentationManager
  participant FormSheetPresentation
  participant FormSheetKeyboardCoordinator
  participant WindowInsetsAnimation
  FormSheetPresentationManager->>FormSheetPresentation: enable keyboard tracking
  FormSheetPresentation->>FormSheetKeyboardCoordinator: setup
  FormSheetKeyboardCoordinator->>WindowInsetsAnimation: install IME callback
  WindowInsetsAnimation->>FormSheetKeyboardCoordinator: report IME progress
  FormSheetKeyboardCoordinator->>FormSheetPresentation: update sheet translation
  FormSheetPresentationManager->>FormSheetPresentation: disable tracking during dismissal
Loading
🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 13.04% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 23 functions across 10 files. (1 skipped:… Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly summarizes the main Android FormSheet change: moving the sheet above the keyboard.
Description check ✅ Passed The description directly explains the Android keyboard integration fix, implementation changes, testing, and visual documentation.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Full details: Docstring Coverage

Explanation

Docstring coverage is 13.04% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 23 functions across 10 files. (1 skipped: 1 unsupported.)

  • Fix all pre-merge checks with AI

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@t0maboro
t0maboro requested a balanced review from Copilot August 31, 2026 15:09
@t0maboro
t0maboro changed the base branch from @t0maboro/fix-landscape-formsheet-android to main August 31, 2026 15:10
@t0maboro
t0maboro changed the base branch from main to @t0maboro/fix-landscape-formsheet-android August 31, 2026 15:10

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

Adds Android FormSheet keyboard-inset handling and a manual cross-platform test scenario.

Changes:

  • Tracks IME insets and animates sheet translation with the keyboard.
  • Constrains sheet content to the safe area.
  • Adds and registers a keyboard integration test scenario.

Reviewed changes

Copilot reviewed 11 out of 12 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
apps/.../scenario.md Documents manual keyboard tests.
apps/.../scenario-description.ts Defines scenario metadata.
apps/.../test-form-sheet-keyboard/index.tsx Implements the test screen.
apps/.../form-sheet/index.ts Registers the scenario.
FormSheetPresentationManager.kt Toggles keyboard tracking by presentation state.
FormSheetPresentation.kt Integrates the keyboard coordinator.
FormSheetAnimatorFactory.kt Dismisses from the current translation.
FormSheetDetents.kt Caps content to safe-area height.
FormSheetCoordinatorHost.kt Removes trailing whitespace.
FormSheetKeyboardCoordinator.kt Animates sheet movement with IME transitions.
FormSheetDimensionsCoordinator.kt Incorporates IME insets into geometry.
FormSheetBehaviorController.kt Updates inset documentation.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

@t0maboro
t0maboro marked this pull request as ready for review August 31, 2026 15:12
@t0maboro
t0maboro force-pushed the @t0maboro/fix-landscape-formsheet-android branch from 7ae7160 to dba2aad Compare September 1, 2026 08:04
@t0maboro
t0maboro force-pushed the @t0maboro/formsheet-keyboard-integration-android branch from b241b8e to af1b60e Compare September 1, 2026 08:07
Base automatically changed from @t0maboro/fix-landscape-formsheet-android to main September 1, 2026 14:21
@t0maboro
t0maboro force-pushed the @t0maboro/formsheet-keyboard-integration-android branch from f3f4220 to 92565a5 Compare September 2, 2026 10:05

@LKuchno LKuchno 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.

Looks good, I left just one suggestion for Android part to avoid confusion what is expected.


3. Tap "Top input".

- [ ] The keyboard slides in and the sheet moves up by the keyboard height, following the keyboard animation – no jump before or after it. "Top input" is focused and visible.

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.

Actually currently when keyboard is extended "Bottom input" and "Dismiss from JS".

Screen.Recording.2026-09-02.at.13.38.57.mov

If this is expected I would add information in this step about this.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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


4. Press the system back button (or use the back gesture).

- [ ] The keyboard hides and the sheet moves back down together with it, settling at the lower detent (0.6). The sheet stays presented.

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.

Note that: "Bottom input" and "Dismiss from JS" are not visible again.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

@t0maboro
t0maboro requested a review from LKuchno September 2, 2026 13:55

@LKuchno LKuchno 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.

LGTM!
You can remove 'On Android' as updated steps are under '## Steps - Android'.

Co-authored-by: lkuchno <45803783+LKuchno@users.noreply.github.com>
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