JSQMessageViewController - How do I set a collection cell to be incoming or outgoing cell?

Question

enter image description here

Using the JSQMessage podfile for iOS, in this method;

collectionView:(JSQMessagesCollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { .. }

How do I set the it to use JSQMessagesCollectionViewCellIncoming or JSQMessagesCollectionViewCellOutgoing? I am finding it diffcult to find examples of how other apps do this

My code;

- (UICollectionViewCell *)collectionView:(JSQMessagesCollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{


    JSQMessagesCollectionViewCell *cell = (JSQMessagesCollectionViewCell*)[super collectionView:collectionView cellForItemAtIndexPath:indexPath];



    [cell.textView setDataDetectorTypes:UIDataDetectorTypeNone];
    cell.textView.text = nil;

    VICChatMessage <JSQMessageData> *messageData = (VICChatMessage*)[collectionView.dataSource collectionView:collectionView messageDataForItemAtIndexPath:indexPath];
    cell.textView.attributedText = messageData.attributedText;

    return cell;
}

score 4 · Accepted Answer · answered Jul 16 '15 at 11:14

I was able to solve the problem. It was to do with the sender details.

By default its JSQDefaultSender but my code was only setting it if it knew the sender; so I used a fallback for when the sender was not known.

The idea is to get the

BOOL isOutgoingMessage = [messageSender isEqualToString:self.sender];

inside the podfile: JSQMessagesViewController.m

So that it positions them either on the left or right.

In the end I had to do this in my code where I obtain my message ready for display

 if (message.sender.remoteID)
    {
        senderID = @"JSQDefaultSender";
    }
    else
    {
        senderID = @"sender";
    }

This works and solved my problem.

Many thanks all

Thenks. isOutgoingMessage delegate method works for me though it was not mentioned anywhere else. — Murad Al Wajed, Mar 24 '20 at 12:49

score 0 · Answer 2 · answered Jul 15 '15 at 14:21

In the messageBubbleImageDataForItemAtIndexPath method, you have to compare the sender of the message with your user. It the sender is your user, return an outgoingMessagesBubbleImage. If not, use a incomingMessagesBubbleImage

- (id<JSQMessageBubbleImageDataSource>)collectionView:(JSQMessagesCollectionView *)collectionView messageBubbleImageDataForItemAtIndexPath:(NSIndexPath *)indexPath
{
    JSQMessagesBubbleImageFactory *bubbleFactory = [[JSQMessagesBubbleImageFactory alloc] init];
    Message *message = [your_messages objectAtIndex:indexPath.item];

    if ([message.senderId isEqualToString:self.senderId]) {
        return [bubbleFactory outgoingMessagesBubbleImageWithColor:[UIColor jsq_messageBubbleBlueColor]];
    }

    return [bubbleFactory incomingMessagesBubbleImageWithColor:[UIColor jsq_messageBubbleLightGrayColor]];
}

Will the bubbleimage actually align them left/right? I will check out your answer. — Atilla Jax, Jul 15 '15 at 14:28
The problem I have is that all my chats are on the left hand side of the screen. Setting bubbles only changes the "orientation" of said bubble. Not its placement on the screen — Atilla Jax, Jul 15 '15 at 14:30

score 0 · Answer 3 · answered Oct 05 '16 at 07:23

0

For anyone searching for this, the current solution is to override the isOutgoingMessage() method on your JSQMessagesViewController and not the approved one.

answered Oct 05 '16 at 07:23

mradzinski

614
1
8
21

JSQMessageViewController - How do I set a collection cell to be incoming or outgoing cell?

3 Answers3