Forum Documentation Showcase Pricing Learn more

[Widgets] Stretch-to-Fit Messenger

Hi Bubblers,

When you’re unsure how long some text in a text element is going to be, it can be difficult to figure out what width to set that element (e.g. if you want text bubbles in a messaging interface, the background color of the text bubble might not wrap neatly around that text and you might have extra space to the right or left of that text). We just posted a new Widget that uses some HTML to fit the background of a text depending on the length of the text itself. Check it out below!

https://widgets.airdev.co/widget/1496772972510x651241166982799700

For more info about the Widgets site, see this thread: Announcing launch of the Widgets site! Showcase your work and see how widgets are built


Happy Bubbling!
The AirDev Team

11 Likes

@anon94914631 I believe this is the new link to it: https://widgets.airdev.co/bubble-widget/stretch-to-fit-messenger-1496772972510x651241166982799700 :slight_smile:

1 Like

This is awesome @alex4! How would I make the line height slightly larger? (Not quite double-spaced, but larger than it currently is)?

Thanks

The text seems to overflow when a long message (without spaces) is sent (see below).

I’ve figured out a workaround nevermind

hai all how can i include image in this chat? Since the RG is not supporting dynamic column height, image is visible only partially ( bcz column hieght is 50 px and the image preview size i put 100*100 px). how can i solve this?