How to link the size of the text input field to the length of the text itself?

how-to
composer

#1

Hello,

I was wondering if there was a way to link the size of the text input field to the length of the text itself? For example if the user types a long name, the text input field (= red rectangle in images below) has to change it’s width accordingly. The same goes for the case when a user types a short name. Please see images attached.

Thanks in advance,

Kind regards,

Nicholas


#2

Hi Nicholas,

You can do this by binding the text input width on its own text and adding a Custom Script converter to compute the width you want. In the example below, I keep a fixed width of 400 pixels for texts with less than 20 characters, then I add 10 pixels for each additional character.

Seb


#3

Hi Seb,

Thank you for your answer! It is very clear and helpful!
When I copied your script code and adjusted some parameters to my experience, The red rectangle changes accordingly until I am at character 42 then the first characters start to fall off. Please see image below.
I’ve set the script to:

if (INPUT.length > 20)
800+(INPUT.length - 20) *10
else
800


#4

Depending on your font style and size, you might need more than 10 pixels per additional character. Try to replace the *10 with something like *15.

Sebastien


#5

Hi Seb,

Thanks a lot! That solved my problem!

Besides, could you tell me how I can make sure that the input text stays the same for the duration of the experience? Because right now, if I re-enter the scene, the input text field has been reset.

kind regards,

Nicholas


#6

By default, a scene has its property “Reset all asset properties” set to true. You can uncheck this property as explained in this article.

Seb


#7

Oh!
Thank you so much, I must have overlooked this feature.

Kind regards,

Nicholas