search

FaridSafi / react-native-gifted-chat

💬 The most complete chat UI for React Native
https://gifted.chat
MIT License
13.45k stars 3.54k forks source link

All messages align to the right, either foreign or personal #1884

Closed Raphaelinyang closed 3 years ago

Raphaelinyang commented 4 years ago

Issue Description

All messages align to the right, please check the image below for more details

Screenshot_20200727-154830

Steps to Reproduce / Code Snippets

<GiftedChat messages={messages.slice()} onSend={ handleSend} user={{id: user.uid, name: user.displayName, avatar: user.photoURL,}} renderBubble={renderBubble} placeholder='Type your message here...' isTyping= {true} renderSend={renderSend} alwaysShowSend loadEarlier={true} showAvatarForEveryMessage={true} scrollToBottom scrollToBottomComponent={scrollToBottomComponent} renderSystemMessage={renderSystemMessage} alignTop={true} renderLoading={renderLoading} />

Expected Results

expect foreign messages to appear at the left, while the current user's message appears on the right

Additional Information

MshahzadRasheed commented 4 years ago

@Raphaelinyang did u solved this problem ? i m also facing same issue .

MshahzadRasheed commented 4 years ago

hi @Raphaelinyang

Issue Description

All messages align to the right, please check the image below for more details

Screenshot_20200727-154830

Steps to Reproduce / Code Snippets

<GiftedChat messages={messages.slice()} onSend={ handleSend} user={{id: user.uid, name: user.displayName, avatar: user.photoURL,}} renderBubble={renderBubble} placeholder='Type your message here...' isTyping= {true} renderSend={renderSend} alwaysShowSend loadEarlier={true} showAvatarForEveryMessage={true} scrollToBottom scrollToBottomComponent={scrollToBottomComponent} renderSystemMessage={renderSystemMessage} alignTop={true} renderLoading={renderLoading} />

Expected Results

expect foreign messages to appear at the left, while the current user's message appears on the right

Additional Information

  • Nodejs version: latest version
  • React Native version: latest version
  • react-native-gifted-chat version: latest version
  • Platform(s) (iOS, Android, or both?): Android

you should maintain your chat data like this {_id:(userID) text:(chat messages) createdAt: formatted time user: { _id: senderID/receiver id name: sender/receiver name } } may be this will help you ..

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.