How to avoid keyboard pushing layout up on Android react-native

The problem here is that you have in your AndroidManifest.xml:

windowSoftInputMode="adjustResize";

Change it to:

windowSoftInputMode="adjustPan"

Note: after this change you'll need run ./gradlew clean in android folder and react-native run-android in your project directory

I tried all the solutions I could find in GitHub or stack overflow. Adding the following line of code in AndroidManifest.xml will be helpful.

I've tried this

windowSoftInputMode="adjustPan"

Sometimes it works but it misbehaves.

And then I came accross this

windowSoftInputMode="adjustResize"

This also misbehaves I finally combined both of them something like this and it works fine out of the box.

android:windowSoftInputMode="adjustPan|adjustResize"

And then you can use react-native KeyboardAvoidingView component.

<KeyboardAvoidingView
    style={{ flex: 1}}
    behavior={Platform.OS === 'ios' ? 'padding' : undefined}
    keyboardVerticalOffset={Platform.OS === 'ios' ? 40 : 0}
  >

Hope this helps you.

putting

android:windowSoftInputMode="adjustNothing"

in Manifest worked for me.

All the answers are good, but didn't work when using expo.

Managed workflow

If using expo you can use softwareKeyboardLayoutMode like this inside app.json:

"android": {
  ...
  "softwareKeyboardLayoutMode": "pan"
},

You need to be on expo version 38.0.0+

Bare workflow

Otherwise, modifying AndroidManifest.xml works:

windowSoftInputMode="adjustPan"

Well, thanks to the React Native FB group I got a solution: The status bar has to be not 'hidden' in order for this to work. Really weird bug..