Multiline Input - Larger text until box full

Questions
1

Hello,

Is it possible in a Multi Line Input to have no scroll bar and instead adjust the font size in real time so that whatever they type fits in the box?

Something like this:

  1. Multiline Input begins with a font of 36:

image

  1. As the user types enough text to fill the box, the font size shrinks to allowing everything they type to be visible on screen:

image

This would continue until a minimum font size is reached (pre-configured).

To store this, both the font size and the text needs to be accessible.

If this isn’t possible in Bubble, is there a way of accomplishing this alongside bubble if I involve a developer?

Things I’ve tried so far:

  1. Adding a Conditional behaviour to the Multiline input:

If # of characters > X and < Y set font size to N Result:

  • Doesn’t work in real time as they are typing
  • The number of characters is not a good measurement of whether the multiline-input is full. It would be ideal to have the number of lines, but I see no such measurement.
  1. Added buttons they can click to make text bigger and smaller.

Result:

  • This is a workaround and not the ideal solution

  • The buttons change the text size (using a custom state on the multiline input)

Thanks for your help,
Matt

2

I understand the effect that you’re going for. (Similar to what Facebook does when writing a status update. …in Facebook’s case, I believe there is only one breakpoint on sizing).

As an alternative, you may try checking out @Reduble.com’s plugin (it’s a bit speedier than Bubble’s built-in utility).