How to set Image background in Message list

[Afroz]

Guide Overview

Language/Framework: React Native UI Kit

UI Kit Version:

"@cometchat/chat-uikit-react-native": "^4.3.16"

This guide can be used to set an Image Background in Message list

Create MessageListStyleInterface and set transparent backgroundColor

const messageListStyle : MessageListStyleInterface = {
        backgroundColor:"transparent",
      };

Create custom customMessageListView and set messageListStyle in CometChatMessageList component

const customMessageListView = ({user, group} : {user?: CometChat.User| undefined, group?: CometChat.Group | undefined}) => {
        return (
            <ImageBackground source={{uri: URI}}>
             <CometChatMessageList
               user={user}
               messageListStyle={messageListStyle}
             >
             </CometChatMessageList>
            </ImageBackground>
         )
       }

Set the custom message list view in CometChatMessages component

<CometChatMessages
      user={user}
      MessageListView={customMessageListView}
    />