解决react-native软键盘弹出挡住输入框的问题

这是效果：

代码：

import React, {Component} from 'react';
import { View, Text, Button, StyleSheet, TextInput, ScrollView, KeyboardAvoidingView, Dimensions  } from 'react-native';
import { StackActions, NavigationActions, withNavigation } from 'react-navigation';

const {width, height} = Dimensions.get('window');
class ChangePassword extends Component {
  static navigationOptions = {
    headerStyle: {
      elevation: 0,  //去除安卓手机header的样式
    },
  };
  constructor(props) {
    super(props);
    this.state = {
      isTrue: false,
      text: '',
      text1: '',
    };
  }
  onChangeText = (text1) => {
    this.setState({
      text1
    },()=> {
      if (this.state.text1.length >= 8) {
        this.setState({
          isTrue: true
        })
      } else if (this.state.text1.length < 8) {
        this.setState({
          isTrue: false
        })
      }
    })
  }
  render() {
    return (
      <ScrollView style={styles.container}>
      <KeyboardAvoidingView behavior="position" keyboardVerticalOffset = {120} >
          <Text style={styles.title}>修改密码</Text>
          <Text style={styles.totst}>密码为8-16位，须包含数字、字母2中元素</Text>
            <TextInput
              style={styles.textinput}
              placeholder="请输入初始密码"
              placeholderTextColor = "#cccccc"
              maxLength = {16}
              value={this.state.value}
              secureTextEntry = {true}
              onChangeText={(text) => this.setState({text})}
            />
            <Text style={styles.Line}></Text>
            <TextInput
              style={styles.textinput}
              placeholder="请输入新密码"
              placeholderTextColor = "#cccccc"
              maxLength = {16}
              secureTextEntry = {true}
              onChangeText={this.onChangeText}
            />
          <Text style={styles.Line}></Text>
          {
            this.state.isTrue == true ? <Text style={styles.errorconfirm} onPress={() => {
              alert('你点击了确认，该跳转了！~')
              // this.props.navigation.navigate('ChangePassword')
            }}>确认</Text> : <Text style={styles.confirm}>确认</Text>
          }
        </KeyboardAvoidingView>
      </ScrollView>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    height: height,
    padding: 16,
  },
  title: {
    color: '#4a4a4a',
    fontSize: 23,
    fontFamily: 'PingFangSC-Semibold',
  },
  totst: {
    color: '#999999',
    fontFamily: 'PingFang-SC-Medium',
    fontSize: 13,
    marginTop: 16,
  },
  Line: {
    height: 1,
    backgroundColor: '#d8d8d8',
  },
  textinput: {
    marginTop: 50,
    color: '#4a4a4a',
    fontSize: 18,
  },
  errorconfirm: {
    marginTop: 44,
    height: 44,
    lineHeight: 44,
    textAlign: 'center',
    fontSize: 16,
    color: '#ffffff',
    backgroundColor: '#25A3FF',
    borderRadius: 4,
  },
  confirm: {
    marginTop: 44,
    height: 44,
    lineHeight: 44,
    textAlign: 'center',
    fontSize: 16,
    color: '#ffffff',
    backgroundColor: '#cccccc',
    borderRadius: 4,
  }
})
export default withNavigation(ChangePassword);

有无用的代码，可自行删除，我不会弄gif的图 ，要不就配一个图了。