时间戳

首页 > 解决方案 > 使用 React-Native-Gifted-Chat 时如何隐藏 Android 键盘？

javascript - 使用 React-Native-Gifted-Chat 时如何隐藏 Android 键盘？

问题描述

我在我的 RN/Expo 应用程序中使用 React-Native-Gifted-Chat。当用户输入消息时，消息框应该随着键盘向上移动。这是我在 iOS 上遇到的行为，但在 Android 上，它掩盖了这个问题。

我试过在“GiftedChat”道具周围加上一个“KeyboardAvoidingView”，但它会将消息框推到屏幕外。

我也尝试了下面看到的内容，虽然键盘没有消失，但在打字时它仍然覆盖了消息框。

下面是我的代码：

<KeyboardAvoidingView>
    <SafeAreaView style = { styles.header }>
      <GiftedChat
        messages={}
        showAvatarForEveryMessage={true}
        onSend={messages => onSend(messages)}
        user={{
          _id:1,
        }}
      />
    </SafeAreaView>  
    </KeyboardAvoidingView>

标签： javascriptandroidreact-nativeexporeact-native-gifted-chat

解决方案

好的，所以下面的解决方案对我有用，但它可能只是因为这个屏幕只是一个“聊天屏幕”的意思：

有人为了发送和接收消息而进入此屏幕，仅此而已。

为了解决这个问题，我消除了所有的“视图”，它给了我想要的行为。

以下是更新后的代码：

return(
    <GiftedChat
        messages={}
        showAvatarForEveryMessage={true}
        onSend={messages => onSend(messages)}
        user={{
          _id:1,
        }}
    />
)

推荐阅读