JSQMessagesCollectionView（消息气泡大小完全相同..）

Question

我正在使用 JSQMessagesCollectionView 构建一个支持聊天的应用程序。到现在为止它工作得很好，因为我开始注意到所有消息气泡的宽度都和第一个一样！如果消息比第一个气泡长，则文本被剪切...（我在后台查看了我发送和接收的消息，文本似乎都很好...）

我想知道我是否在正确设置 JSQMessagesCollectionView 时做错了什么……我想不通:(

这是我的代码：

// Total number of Messages in Section
override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return messages.count
}

// Message Data Model At IndexPath
override func collectionView(collectionView: JSQMessagesCollectionView!, messageDataForItemAtIndexPath indexPath: NSIndexPath!) -> JSQMessageData! {

    return messages[indexPath.item]
}

//messageBubbleImageDataForItemAtIndexPath
override func collectionView(collectionView: JSQMessagesCollectionView!, messageBubbleImageDataForItemAtIndexPath indexPath: NSIndexPath!) -> JSQMessageBubbleImageDataSource! {

    let message = messages[indexPath.item]

    if (outgoing(message)) {
        print(outgoingBubble)
        return outgoingBubble
    } else {
        return incomingBubble
    }
}

override func collectionView(collectionView: JSQMessagesCollectionView!, avatarImageDataForItemAtIndexPath indexPath: NSIndexPath!) -> JSQMessageAvatarImageDataSource! {

    return avatarImageBlank // Return an empty avatar image for now
}


// Collection View text color and hyperlink
override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {

    let cell = super.collectionView(collectionView, cellForItemAtIndexPath: indexPath) as! JSQMessagesCollectionViewCell

    let message = messages[indexPath.item]

    if (outgoing(message)) {

        cell.textView!.textColor = UIColor.whiteColor()
    } else {
        cell.textView!.textColor = UIColor.blackColor()
    }

    // Under line links
    let attributes : [String:AnyObject] = [NSForegroundColorAttributeName:cell.textView!.textColor!, NSUnderlineStyleAttributeName: 1]
    cell.textView!.linkTextAttributes = attributes

    return cell
}


// Usernames above bubbles at Indexpah
override func collectionView(collectionView: JSQMessagesCollectionView!, attributedTextForMessageBubbleTopLabelAtIndexPath indexPath: NSIndexPath!) -> NSAttributedString! {

    let message = messages[indexPath.item]

    if (outgoing(message)) {
        return nil
    }

    // Same as previous sender, skip, eg. 2nd message from other sender
    if indexPath.item > 0 {
        let previousMessage = messages[indexPath.item - 1]

        if (previousMessage.senderId() == message.senderId()) {

            return nil
        }
    }

    // Otherwise, mark sender's name
    return NSAttributedString(string:message.senderDisplayName())

}

//heightForMessageBubbleTopLabelAtIndexPath (Flow Layout)

override func collectionView(collectionView: JSQMessagesCollectionView!, layout collectionViewLayout: JSQMessagesCollectionViewFlowLayout!, heightForMessageBubbleTopLabelAtIndexPath indexPath: NSIndexPath!) -> CGFloat {

    let message = messages[indexPath.item]

    // Sent by sendor, skip

    if (outgoing(message)) {
        return CGFloat(0.0)
    }

    // Same as previous sender, skip
    if indexPath.item > 0 {
        let previousMessage = messages[indexPath.item - 1]
        if (previousMessage.senderId() == message.senderId()) {
            return CGFloat(0.0)
        }
    }
    return kJSQMessagesCollectionViewCellLabelHeightDefault
}

我将传入和传出的消息气泡定义如下：

let incomingBubble = JSQMessagesBubbleImageFactory().incomingMessagesBubbleImageWithColor(UIColor.lightGrayColor())
let outgoingBubble = JSQMessagesBubbleImageFactory().outgoingMessagesBubbleImageWithColor(UIColor(red: 82.0/255.0, green: 181.0/255.0, blue: 1, alpha: 1.0))

Answer 1

好的，我自己解决了这个问题。出现这种行为的原因是因为我为我的项目创建了一个自定义的 JSQMessage 数据模型（例如 Messaging class）。当我使用默认的 JSQMessage 数据模型时，一切正常（如下所示）。

    func createTextMessage(item: [String: AnyObject]) -> JSQMessage {

    return JSQMessage.init(senderId: item["userId"] as! String,
                            senderDisplayName: item["name"] as! String,
                            date: String2Date(item["date"] as! String),
                            text: item["text"] as? String)
}

Answer 2

您可能还没有为您的消息模型实现“_hash”。这就是我第一次实施时所做的。

JSQMessagesCollectionView（消息气泡大小完全相同..）

JSQMessagesCollectionView (Message Bubble size all identical..)

swift

chat

collectionview

jsqmessagesviewcontroller