React-Native keyboard problems

Question

Good night,

I’m having a problem on the keyboard of my android application, I would like when opening the keyboard of the same, only the bottom text box if moved, or the items of the screen adjusted automatically, but this does not happen in any way.

Pagina.js

import React, { Component } from 'react';
import { View, Text, StyleSheet, Image, TextInput, KeyboardAvoidingView } from 'react-native';

class Pagina extends Component {

    render() {
        return (
            <KeyboardAvoidingView style={style.container} behavior="padding" enabled>
                <View style={style.barNav}>
                    <Text>xxx</Text>
                </View>

                <Image 
                    style={style.imagem} 
                    source={{ 
                        uri: "https://nospensees.fr/wp-content/uploads/2018/02/femme-en-position-du-lotus.jpg"
                    }} 
                />

                <Image 
                    style={style.imagem} 
                    source={{ 
                        uri: "https://nospensees.fr/wp-content/uploads/2018/02/femme-en-position-du-lotus.jpg"
                    }} 
                />

                <TextInput style={style.entradaTexto} placeholder="Digite sua mensagem aqui!" />
            </KeyboardAvoidingView>
        );
    }
}

const style = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center'
    },
    barNav: { 
        width: 100 + '%',
        height: 50,
        paddingTop: 5,
        justifyContent: 'center',
        alignItems: 'center'
    },
    imagem: {
        width: 100 + '%',
        height: 100
    },
    entradaTexto: {
        width: 100 + '%',
        height: 80
    },
})

export default Pagina;

Manifest File:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.Chat">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>

Practical result of the operation:

Other information:

React-Native-cli: 2.0.1 and React-Native: 0.55.4

Answer 1

I was having the same problem developing for Android, I managed to fix the solution this way:

Open the androidManifest, edit the following line:

android:windowSoftInputMode="adjustResize"

Insert the "adjustPan" as well, thus:

android:windowSoftInputMode="adjustPan|adjustResize"

Okay, so the native Android keyboard does not change positions Views declared in its code.