React Native Keyboard 在 Android 上覆盖了 TextInput KeyboardAvoidingView

Question

我想为聊天应用程序创建一个 TextInput。在 Ios 上一切正常，但在 Android 上，如果键盘打开，TextInput 会被覆盖：

它看起来应该与 Ios 上的一样：

我的代码如下所示：

<KeyboardAvoidingView enabled behavior={Platform.OS == 'ios' ? 'padding' : null} keyboardVerticalOffset={Platform.OS == 'ios' ? null : 90} style={{felx: 1, width: "100%", flexDirection: "row", alignItems: "center", marginVertical: 5, justifyContent: "center" }}>
          <TouchableOpacity>
            ...
          </TouchableOpacity>
          <TextInput style={{
            height: 47,
            width: "80%",
            backgroundColor: "#fff",
            paddingHorizontal: 10,
            borderRadius: 14,
            color: "grey",
            fontSize: 17,
          }}
          editable={this.state.inputdisabled}
          placeholder={"Nachricht..."}
          value={nachricht}
          blur={true}
          blurOnSubmit={false}
          multiline
          clearButtonMode='always'
          onChangeText={text => this.setState({nachricht: text})}
          />
          <TouchableOpacity>
            ..
          </TouchableOpacity>
        </KeyboardAvoidingView>

Answer 1

将 expo 应用程序执行到基本工作流程后，一切看起来都很好。

Answer 2

代码看起来不错，您可以将内容包装在视图中的 KeyboardAvoidingView 主体内，并在视图内移动您的样式

React Native Keyboard 在 Android 上覆盖了 TextInput KeyboardAvoidingView

React Native Keyboard covers TextInput KeyboardAvoidingView on Android

keyboard

android

react-native

expo