В моем реагирующе-родном коде клавиатурное представление не работает

Question

Я в беспокойстве.В моем коде клавиатурное представление не работает.Я использую клавиатуру, избегая просмотра, но когда я заполняю подтверждение пароля, то textInput будет на задней части клавиатуры и не отображается.Пожалуйста, предложите мне лучший ответ для моего кода code.my: -

<SafeAreaView style={{ flex: 1 }}>
    <View>
        <View>
            <Image source={require('../img/LykaLogo.png')} style={{ width: 100, height: 100 }} />

        </View>
    </View>
    <View >
    <KeyboardAvoidingView behavior='padding'>
        <View>
            <Text style={{fontSize:15,}}>CREATE USER ACCOUNT</Text>
        </View>
        <View >
        <View >
        <TextInput
                placeholder='FULL NAME'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='USERNAME'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='EMAIL'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='PHONE'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='PASSWORD'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View>
        <TextInput
                placeholder='CONFIRM  PASSWORD'
                inputStyle={{fontSize:15}}               
            />
        </View>
        </View>
        </KeyboardAvoidingView>
    </View>
</SafeAreaView>

Answer 1

Я рекомендую вам вообще не использовать KeyboardAvoidingView для Android, поведение клавиатуры по умолчанию в Android достаточно хорошее.

Вот пример того, как это сделать:

import { Platform } from 'react-native';

...

renderContent() {
  return (
    <View>
      ...
    </View>
  )
}

render() {
  return (
    <View>
      {Platform.OS === 'android' ? this.renderContent() :
        <KeyboardAvoidingView behavior='padding' enabled>
          {this.renderContent()}
        </KeyboardAvoidingView>}
    </View>
  );
}

Более короткое решение, которое также может работать для вас, состоит в том, чтобы не устанавливать свойство behavior для Android. Установите его только для iOS:

import { Platform } from 'react-native';

...

render() {
  return (
    <View>
      <KeyboardAvoidingView behavior={Platform.OS === 'android' ? '' : 'padding'} enabled>
        ...
      </KeyboardAvoidingView>
    </View>
  );
} 

Это из официальных документов, касающихся behavior свойства KeyboardAvoidingView:

Android и iOS взаимодействуют с этим объектом по-разному. Android может вести себя лучше, когда ему вообще не дают никакой поддержки, а iOS - наоборот.

Источник