0

I've tried every solution to get rid of the space between the keyboard and input field in gifted chat but nothing works. Weirdly bottomOffset does not do anything either, at all. It's probably related to safeAreaView, and looks as it's supposed to do when the keyboard is closed. I also tried the safeAreaView = false prop on gifted chat but again.. nada..

Any ideas on how to get rid of this space are highly appreciated! enter image description here enter image description here

And this is the code:

<GiftedChat
    messages={messages}
    user={{
      _id: currentUser.uid,
    }}
    isTyping={true}
    renderBubble={renderBubble}
    renderInputToolbar={renderInputToolbar}
    renderSend={renderSend}
    onSend={onSend}
  />

const renderInputToolbar = props => {

return <InputToolbar
  {...props}

  containerStyle = {{
    marginLeft: 15,
    marginRight: 15,
    backgroundColor: colors.white,
    alignContent: "center",
    justifyContent: "center",
    borderWidth: 0,
    paddingTop: 6,
    borderRadius: 30,
    borderTopColor: "transparent",
  }}
/>

};

elijaveto
  • 31
  • 2

1 Answers1

1

You should edit the bottomOffset from GiftedChat, if you are using a createBottomNavigator, this thread has the answer at the end: https://github.com/FaridSafi/react-native-gifted-chat/issues/2147, where you can automatically get the specific bottomOffset for any screen.

Gyalpo Dongo
  • 71
  • 1
  • 4