Search code examples
react-native-gifted-chat

How do I set the color of quick reply text in Gifted Chat?

I see how to set the styles of quick reply options in React Native Gifted Chat using quickReplyStyle, but no styles set there seem to have any effect on the color of the quick reply text itself.

How do I set the color of quick reply text in Gifted Chat?

Solution

  • The text color is a property on the QuickReplies component [source], so you'll need to change it in the renderQuickReplies property like so:

    <GiftedChat
    ...
    renderQuickReplies={(props) => <QuickReplies color='red' {...props} />}
    ...
/>

    Note: the text will always be white when the quick reply is selected.

    You may need to add the import for QuickReplies like so:

    import QuickReplies from 'react-native-gifted-chat/lib/QuickReplies';

    Helpful, related issue here.