Issue with JSQMessages Displaying Test Messages

Question

When I add multiple test messages, only two of them are displaying on screen. The other messages are clearly there because I can copy them, but the colors are simply not showing. When I scroll around, a new two texts appear, but it is still only two. Below show some examples.

First screenshot shows when the screen first loads. second shows when I move it around. Third shows that the other messages do exist but are not visible. Any ideas on how to fix this? Also, how do I make the names appear? Is there a good guide to doing this in Swift?

Here is the code I used:

    var messages = [JSQMessage]()

var incomingBubbleImageView = JSQMessagesBubbleImageFactory.incomingMessageBubbleImageViewWithColor(UIColor.jsq_messageBubbleLightGrayColor())
var outgoingBubbleImageView = JSQMessagesBubbleImageFactory.outgoingMessageBubbleImageViewWithColor(UIColor.jsq_messageBubbleGreenColor())

override func viewDidLoad() {
    super.viewDidLoad()

    self.sender = UIDevice.currentDevice().identifierForVendor?.UUIDString

    messages += [JSQMessage(text: "hello", sender: self.sender)]
    messages += [JSQMessage(text: "hello", sender: "other")]
    messages += [JSQMessage(text: "hello", sender: self.sender)]
    messages += [JSQMessage(text: "hello", sender: "other")]
    messages += [JSQMessage(text: "hello", sender: self.sender)]
    messages += [JSQMessage(text: "hello", sender: "other")]

    reloadMessagesView()

}

func reloadMessagesView() {
    self.collectionView?.reloadData()
}

And here is the extension code for the delegate methods:

extension TestJSQ {

override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    print(self.messages.count)
    return self.messages.count
}

override func collectionView(collectionView: JSQMessagesCollectionView!, messageDataForItemAtIndexPath indexPath: NSIndexPath!) -> JSQMessageData! {
    let data = self.messages[indexPath.row]
    return data
}

// override func collectionView(collectionView: JSQMessagesCollectionView!, didDeleteMessageAtIndexPath indexPath: NSIndexPath!) { // self.messages.removeAtIndex(indexPath.row)

override func collectionView(collectionView: JSQMessagesCollectionView, bubbleImageViewForItemAtIndexPath indexPath: NSIndexPath) -> UIImageView {

    let data = messages[indexPath.row]
    switch(data.sender) {
    case self.sender:
        return self.outgoingBubbleImageView
    default:
        return self.incomingBubbleImageView
    }

    }

override func collectionView(collectionView: JSQMessagesCollectionView!, avatarImageViewForItemAtIndexPath indexPath: NSIndexPath!) -> UIImageView! {
    return nil
}

}

Any help would be much appreciated!!!

You should invalidate the layout before reloading data. I'm not sure about the equivalent in swift, but in Objective-C you do: `[self.collectionView.collectionViewLayout invalidateLayoutWithContext:[JSQMessagesCollectionViewFlowLayoutInvalidationContext context]];` before calling `[self.collectionView reloadData];` — Gianni Carlo, Mar 21 '16 at 21:54
Is that all the code for your subclass of `JSQMessagesViewController`? Do you implement `viewWillAppear` and/or `viewDidAppear` if so, can you check if you're calling the appropriate `[super viewWillAppear:animated]` or `[super viewDidAppear:animated]` swift counterpart? — Gianni Carlo, Mar 23 '16 at 03:35
By the way, for the other part of your question about the names, you can use `collectionView:attributedTextForMessageBubbleTopLabelAtIndexPath:` method from the `JSQMessagesCollectionViewDataSource` — Gianni Carlo, Mar 23 '16 at 03:41

score 0 · Answer 1 · edited Mar 16 '18 at 13:55

0

You need to call self.finishReceivingMessage() after you add the message(s) to the data source (which will then invalidate layout BEFORE call collectionView.reloadData() for you)

edited Mar 16 '18 at 13:55

Philipp Maurer

2,480
6
18
25

answered Mar 16 '18 at 13:29

Tung Tran

111
5

Issue with JSQMessages Displaying Test Messages

1 Answers1