Блог

Главная - Вопросы по программированию - клавиатура скрывает ввод текста . React Native (Expo CLI)

клавиатура скрывает ввод текста . React Native (Expo CLI)

#javascript #reactjs #react-native #keyboard #jsx

Вопрос:

клавиатура скрывает некоторый ввод текста , я пытаюсь использовать KeyboardAvoidingView. здесь это не имеет никакого эффекта. ?

это мой код

  • СМОТРИТЕ КОД МЕЖДУ *****

ЕСЛИ я оберну представление прокрутки с помощью KeyboardAvoidingView или я оберну представление прокрутки с помощью прокрутки.. здесь это ничего не меняет, я пробовал и то, и другое

 //import statments 

    return (

        <View style={style.MainContainer}>

            <View style={style.chooseDpContainer}>

  <TouchableOpacity onPress={openImagePickerAsync} style={style.chooseDpContainer}>
{(!ImageUrl)?(<><Avatar.Icon size={70} icon="camera-plus-outline" style={{marginEnd:10}} />
<Text>Choose a cool  Dp for your Pet</Text></>):
 (<><Avatar.Image size={70} source={{uri:ImageUrl}} style={{marginEnd:10}}/>
 
  <Text>Choose another Image?</Text>
  <Button mode="text" icon="delete" style={{fontSize:40}}  onPress={()=>{
      setImageUrl('')
  }}>Remove</Button>
  </>
 )}
  </TouchableOpacity>
  </View>
  <View style={style.divider} ></View>
  <Text style={{marginBottom:10}}>Your Pet Details</Text>

{/* KEYBOARD HIDES INPUT, PLEASE  REVIEW THIS CODE*/}
{/* *************************************************** */}

 <KeyboardAvoidingView style={{width:'100%'}}
 behavior={Platform.OS==="ios"?'padding':"height"}>
  <ScrollView style={{width:'100%'}}>
    {/* //  behavior='position'> */}
  <View style={style.Input}><TextInput label="Name"/></View>
  <View style={style.Input}><TextInput label="Age"/></View>
  <View style={style.Input}><TextInput label="Breed"/></View>
  <View style={style.Input}><TextInput label="Gender"/></View>
 
  </ScrollView>
  </KeyboardAvoidingView>

    {/* KEYBOARD HIDES INPUT, THANKS*/}  
{/* *************************************************** */}

        </View>
    )
}

Комментарии:

1. То KeyboardAvoidingView следует завернуть ScrollView также. Вы пробовали сделать это таким образом?

2. да , я пытался.

3. проверьте после удаления поведение клавиатуры, избегающей просмотра. удалить: {/* behavior={Platform.OS==="ios" ? 'padding':"height"} */}

4. попробовал это, никаких изменений.. Я обновил свой код, проверьте это.

Метки: