Scroll behavior issue in KeyboardAwareScrollView after navigating between two modals

[Foxenz]

Describe the bug
I am using two modals (Modal1 and Modal2), each containing a ScrollView filled with inputs. These inputs are wrapped inside a KeyboardAwareScrollView to handle scrolling when the keyboard opens.

Issue: the scrolling behavior is no longer correct. The header of Modal1 is also affected by the scroll.

The issue only occurs when navigating between two modals, both of which use a KeyboardAwareScrollView.
I’ve confirmed that each modal works fine independently, but returning to the first modal after interacting with the second one seems to "break" the scroll behavior.

Repo for reproducing
repo link

To Reproduce
Steps to reproduce the behavior:

1. Open Modal1 and click on an input. Scrolling works as expected: the input is properly moved above the keyboard.
2. Navigate to Modal2 and click on an input. The behavior is also correct.
3. Navigate back to Modal1 and click on an input again.

Expected behavior
Want to keep the same behavior as in the beginning

Screenshots

Record_2025-01-13-17-55-21.mp4

Smartphone (please complete the following information):

• Desktop OS: [Windows 11]
• Device: [One Plus Nord]
• OS: [Android 12]
• RN version: [0.76.6]
• RN architecture: [new]
• JS engine: [Hermes]
• Library version: [1.15.2]

[kirillzyusko]

@Foxenz I think this bug happens because you have softwareKeyboardLayoutMode=pan. When KeyboardAwareScrollView gets mounted it'll change it to resize, when second KeyboardAwareScrollView gets mounted it will again change it to resize, but on unmount it restores default settings and will change it back to pan.

Can you try to specify it as resize in app.json and see if it fixes the problem?

[kirillzyusko]

My suggestion here is to change softwareKeyboardLayoutMode=resize to default value, and manually call KeyboardController.setInputMode(AndroidSoftInputModes.SOFT_INPUT_ADJUST_PAN); on screens where you rely on that behavior.

In this case keyboard-controller will work with resize mode and you still have a flexibility in terms of managing inputMode on Android.

I'm going to close that issue. I also have a guide explaining how hooks works and how to create your own version of the hook (though this guide is not applicable to pre-built components, but still can shed some light on some internals).

Also feel free to check a documentation about setInputMode.