How to put messageBottomLabel inside of message bubble?

Question

I am using messageKit. I want to add time when the message was sent inside of messageBottomLabel. However visually it is outside of message bubble.

But I want it to be inside of the bubble, like this:

How can I do it?

Answer 1

1. You have to hide the default bottom label. (MessagesLayoutDelegate)
2. Make a custom cell for each kind of message you want to change.
3. Register cell
4. Change the function below to use the custom cell.

func customCell(for message: MessageType, at indexPath: IndexPath, in messagesCollectionView: MessagesCollectionView) -> UICollectionViewCell

5. Add a label to the content view of the cell.
6. At cell configuration

func configure(with message: MessageType, at indexPath: IndexPath, and messagesCollectionView: MessagesCollectionView)

set label text like this:

    if let dataSource = messagesCollectionView.messagesDataSource {
        captionLabel.text = dataSource.messageBottomLabelAttributedText(for: message, at: indexPath)
    } else { fatalError("Datasource is null!") }

7. Then, you have to calculate the height of the cell at

override func messageContainerSize(for message: MessageType) -> CGSize