Height adjustment when keyboard appears is wrong

Hi, I am trying to shorten the screen when the keyboard is active. But it always adjust it weirdly in android, it works fine in iOS.

Before keyboard is active:

After keyboard is active:

I am using RN 0.37, this also happens when i am starting from scratch:

This is my code:

import React from 'react';

import {
  Keyboard,
  Dimensions,
  ScrollView,
  StyleSheet,
  Text,
  TextInput,
  AppRegistry
} from 'react-native';

var {height, width} = Dimensions.get('window');
var _keyboardWillShowSubscription;
var _keyboardWillHideSubscription;
height = height - 20;

class awesomeproject extends React.Component {
  constructor(props) {
 		super(props);
 		this.state = {
			height: height,
		};
	}
	componentDidMount() {
		_keyboardWillShowSubscription = Keyboard.addListener('keyboardDidShow', (e) => this._keyboardWillShow(e));
		_keyboardWillHideSubscription = Keyboard.addListener('keyboardDidHide', (e) => this._keyboardWillHide(e));
	}
	componentWillUnmount() {
		_keyboardWillShowSubscription.remove();
		_keyboardWillHideSubscription.remove();
	}
	_keyboardWillShow(e) {
		this.setState({height: height - e.endCoordinates.height});
	}
	_keyboardWillHide(e) {
		this.setState({height: height});
	}
  render() {
    return (
		<View style={{height: this.state.height}}>	
			<View style={{backgroundColor: 'blue', flex: 1}} />
			<View style={styles.fieldBox}>
				<TextInput 
					style={styles.field}
					placeholder={'hello'}
					autoCapitalize={'none'}
					placeholderTextColor={'#afbccc'}
					blurOnSubmit={false}
					autoCorrect={false}
					ref={'textinput'}
					onChangeText={(data) => this.setState({message: data})} />
			</View>
		</View>
    );
  }
}

const styles = StyleSheet.create({
  field: {
		color:'black',
		fontWeight:'bold',
		fontSize:18,
		flex: 1,
		marginHorizontal: 10
	},
});

AppRegistry.registerComponent('awesomeproject', () => awesomeproject);

[vonovak]

try the keyboardavoidingview

[Friendly-Robot]

kelvinaliyanto’s advice isn’t too far off. If that doesn’t work, try replacing

android:windowSoftInputMode="adjustResize"

with

android:windowSoftInputMode="adjustPan"

in your android/app/src/main/Android.Manifest.xml.