Iglistkit: Message Bubble

[asimonv]

Not really an issue, but more of a question really. How can I make a chat message bubble like the one on iMessages? More precisely, how can I apply some style to the entire section? The bubble's width must depend on the text width and have a maximum.

[yusuftor]

Inside your UICollectionViewCell have a UIView as the background of the message bubble. Apply a corner radius to this view to make it more bubble like. Put a UILabel inside the UIView and lay it out with autolayout so that the leading or trailing edge of the UIView is >= some_padding of the UICollectionViewCell's leading or trailing edge. That way it'll adjust the width of the bubble manually. Do the height calculations manually inside the section controller based on the width supplied by the collectionContext. That's basically it.

[asimonv]

Yes! That's why I ended up doing but without autolayout.
I thought that there was a way to use multiple cells to do this:

But maybe they actually do it! The top/bottom cell has top/bottom bordered radius and they all are padded with the same value!

[rnystrom]

Check out how I create bubbles composed of multiple cells in GitHawk as well.

https://github.com/GitHawkApp/GitHawk/blob/master/Classes/Issues/Comments/IssueCommentBaseCell.swift

Both single-cell and multi cell strategies are ok! Just go with what works best for you.

_{Sent with GitHawk}

[asimonv]

OMG thanks @rnystrom and @yusuftor ☺️

_{Sent with GitHawk}