CODEWITHSUNDEEP
react-nativereact-native-gifted-chat
Nimra Baig
Nimra Baig

Reputation: 11

Is there any way to display an image along with some text and a button all together with response message in react-native-gifted-chat?

I'm working with react-native-gifted-chat and I want to make a UI similar to a picture attached in a link. I want to add this card type feature along with a response message in react-native-gifted-chat but I dont have a clue whether this is possible to execute with gifted chat or not. Screenshot of my expected output

Upvotes: 1

Views: 793

Answers (1)

Bob T
Bob T

Reputation: 318

Yes, this requires creating a custom component that you pass into the renderMessage prop of <GiftedChat />:

<GiftedChat
  messages={...}
  onSend={...}
  user={...}
  ...
  renderMessage={props => (
    <MyCustomMessage
      {...props}
    />
  )}
/>

In this case, MyCustomMessage would be a component that contains all of the custom layout/logic you want. Check out the Slack style UI example in the react-native-gifted-chat repository for a good starting point.

Upvotes: 0

Related Questions