Issue with JSQMessages Displaying Test Messages - ios

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!!!

Answer 1

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)