У меня проблема с KeyboardAvoidingView на android. Он отлично работает с iOS. У моего экрана есть компоненты просмотра в верхней половине экрана, которые могут или не могут влиять на него. Я пробовал удалить каждый из этих компонентов, но KeyboardAvoidingView работает только тогда, когда я удаляю компонент, занимающий 60% экрана. Этот компонент представляет собой проигрыватель YouTube от «react-native-youtube» в стиле flex: 1.
Мой код выглядит примерно так ...
<KeyboardAvoidingView
behavior = "padding"
keyboardVerticalOffset = {200}
>
<View style = {styles.first}>
<View style = {styles.second}>
<TouchableHighlight />
<View style = {styles.third}>
<TextInput
style = {styles.textInput}
maxLength = {80}
autoGrow = {true}
maxHeight = {130}
multiline = {true}
editable = {true}
onChangeText = {onChange}
value = {descriptionText}
autoFocus = {true}
keyboardType = {'default'}
autoCorrect = {false}
placeholder = {'Send a word'}
underlineColorAndroid = {white}
selectionColor = {purple}
returnKeyType = {'send'}
onSubmitEditing = {handleSubmit}
/>
</View>
</View>
</View>
<KeyboardAvoidingView/>
first: {
flexDirection: 'column',
justifyContent: 'flex-start',
position: 'relative',
marginTop: 0,
},
second: {
width: screenWidth,
flexDirection: 'row',
alignItems: 'center',
paddingTop: 5,
paddingBottom: 9,
},
third: {
flexDirection: 'row',
borderTopLeftRadius: 10,
borderBottomLeftRadius: 10,
paddingBottom: 5,
paddingLeft: 10,
paddingRight: 10,
width: screenWidth - 102,
minHeight: 36,
alignItems: 'center',
},
textInput: {
textAlign: 'left',
fontSize: 14,
fontWeight: '400',
flex: 1,
padding: 0,
margin: 0,
}
Есть ли здесь что-нибудь, что может повлиять на функциональность KeyboardAvoidingView? Я уже пытался удалить behavior = "padding" из-за документов React Native, в которых упоминается, что он работает лучше на Android, когда эта опора удаляется.
Спасибо!
Работа с клавиатурой может быть сложной.
Однако Android (на этот раз) действительно упрощает задачу.
import { Platform } from 'react-native';
const isAndroid = Platform.OS === 'android';
componentDidMount() {
if (isAndroid) {
SoftInputMode.set(SoftInputMode.ADJUST_PAN);
}
}
Попытайтесь добавить гибкость ко всем стилям, это может помочь, и, возможно, также в KeyboardAvoidingView.
<KeyboardAvoidingView
style = {{flex: 1}}
keyboardVerticalOffset = {0}
behavior = {'padding'}
>
Выставка закусок: https://snack.expo.io/BJT-4Fphz
это тоже не сработало. попытался добавить flex: 1 в каждый вид вокруг него. затем удалил каждого по одному, и это не сработало :( thx tho! любые другие рекомендации были бы потрясающими
@Dres, вы можете поиграть в моей закусочной ссылке выше.
Благодарность! Так намного проще, чем перезагружать приложение, над которым я работаю. Я думаю, что содержимое верхней половины может вызывать такое ожидаемое поведение. я буду продолжать подключаться к нему!
нет, я зацепил SoftInputMode из github.com/MR03web/react-native-set-soft-input-mode, в котором я редактировал build.gradle, settings.gradle и mainapplication.java. я получаю ошибки после всего этого. Спасибо хоть!