androidreactjsreact-nativeexpokeyboard

Keyboard fills entire screen in landscape mode in react native on Android


When TextInput is focused, the keyboard takes the entire screen real estate in landscape mode:

keyboad fills entire screen in landscape mode

The portrait mode looks fine:

keyboad appears normally in portrait mode

Also, compared to the portrait mode, the keyboard adds an input field and an action button (i.e. 'Done') in the landscape mode. I guess it's fall out from the actual TextInput being hidden by the keyboard, so the keyboard is supplying a substitute. This behaviour is observed on a small phone and a small phone emulator, but not on a tablet because of the tablet's bigger screen.

What I actually want to have is something like below, where the keyboard has the same layout like in the portrait mode and sits below the TextInput:

desired appearance of keyboard in landscape mode

I am using expo, so I've tried to use

      "softwareKeyboardLayoutMode":"pan"

which didn't help.

I've also tried to replace SafeAreaView with KeyboardAvoidingView with behavior set either to {'height'} or {'undefined'} which didn't help either.

Would appreciate any suggestions.


Solution

  • Have you tried disableFullscreenUI={true}?