Messagekit: How to adjust the position of message bubble

[bofiaza]

MessageKit version: 1.0.0-beta.1

I'm grouping some messages and having this code for the message style:

func messageStyle(for message: MessageType, at indexPath: IndexPath, in messagesCollectionView: MessagesCollectionView) -> MessageStyle {
    if shouldStartNewGroup(from: indexPath) {
        let corner: MessageStyle.TailCorner = isFromCurrentSender(message: message) ? .bottomRight : .bottomLeft
        return .bubbleTail(corner, .curved)
    } else {
        return .bubble
    }
}

This is how the message bubbles look like:

To adjust the non-tailed bubble a little bit to the left (so that it aligns perfectly along the red line), I have this:

override func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let size = super.collectionView(collectionView, layout: collectionViewLayout, sizeForItemAt: indexPath)

    if size == .zero || self.shouldStartNewGroup(from: indexPath) {
        return size
    } else {
        let newSize = CGSize(width: size.width - 12, height: size.height)
        return newSize
    }
}

which resulted to this:

For my question, is this the correct approach or is there a better way to achieve this?

[SD10]

@bofiaza You can set some padding around the message container by using these:
https://github.com/MessageKit/MessageKit/blob/10c98b04fe95bfe98cebaeacf726b0070a27d68f/Sources/Layout/MessageSizeCalculator.swift#L41-L42

[stale[bot]]

This issue has been marked as stale because it has not had recent activity. It will be closed if no further activity occurs.

[stale[bot]]

This issue has been auto-closed because there hasn't been any activity for at least 21 days. However, we really appreciate your contribution, so thank you for that! 🙏 Also, feel free to open a new issue if you still experience this problem 👍.

[hjuraev]

This would not resolve the issue because it will mark all incoming and outgoing with specific paddings. We need to specify only for message bubbles with tales and not all of them. Is there a way to customize padding per message?

[Skornos]

Previously there was this method on MessagesLayoutDelegate but it's been deprecated. Is there a replacement how to make padding dynamic/based on the message?

    func messagePadding(for message: MessageType, at indexPath: IndexPath, in messagesCollectionView: MessagesCollectionView) -> UIEdgeInsets {
        fatalError("messagePadding(for:at:in) has been removed in MessageKit 1.0.")
    }

[cyrilzakka]

@bofiaza what is the shouldStartNewGroup() function?

[Faari7]

hi, i am facing the same issue here. I need to know how can we give extra space to specific cell/message?

[richardxyx]

@bofiaza @Faari7 @hjuraev Have any of you found a good way to solve this misalignment problem? Just moving the bubble results in misalignment of the label, so it's not great either way for me right now.

[d-jeong]

Any better solutions to this? @Faari7 @SD10

[IrelDev]

Same issue here, any solutions?