Question

我在Android上遇到KeyboardAvoidingView的问题。它适用于iOS。我的屏幕在屏幕的上半部分有一个视图组件，可能会也可能不会影响它。我已经尝试删除这些组件，但是当我删除占用屏幕60％的组件时，KeyboardAvoidingView才有效。此组件是来自“react-native-youtube”的YouTube播放器，其格式为HeapAlloc。

我的代码看起来像这样..

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已经由于React Native文档提到它在删除该prop时在android上运行得更好。

谢谢！

Answer 1

尝试将flex添加到所有样式可能会有所帮助，也可能在KeyboardAvoidingView中。

<KeyboardAvoidingView
  style={{flex: 1}}
  keyboardVerticalOffset={0}
  behavior={'padding'}
>

Snack Expo：https://snack.expo.io/BJT-4Fphz

Answer 2

使用键盘可能很困难。

然而，Android（一次性）确实使它变得更简单。

import { Platform } from 'react-native';

const isAndroid = Platform.OS === 'android';

componentDidMount() {
  if (isAndroid) {
    SoftInputMode.set(SoftInputMode.ADJUST_PAN);
  }
}

即使删除了行为，KeyboardAvoidingView也无法在Android上运行

2 个答案: