Auto resizing text label

Help and Feedback Scripting Support
#1

This is a video of what I want taken from Pet Simulator X. (Look at my cursor on the left).
Basically when I hover over buttons I want a little grey text label to show text of what the button does.
In the example when I hover over the hoverboard button it says “hoverboard” when I hover over the Teleport button it says “Teleport” and so on.
So i’ve tried to do it by adding a textlabel with automaticsize = X. So that the more text the longer the frame. The problem is, the text is too big. But it need TextScaled = true so that it works on all devices so because TextScaled == true I can’t make the text any smaller
Pet Simulator X example


What I’ve done (The word "inventory is too large - the text takes up too much of the white rectangle)
image

#2

are you telling how to shrink the text?

#3

Yes I want to shrink the text while still having TextScaled = true because they contradict.
If text scaled == true then the text is too big. If text scaled == false then the text doesn’t scale across all devices

#4

You don’t need the text to be auto-scaled.

As long as you have the frame as decently big as the mouse (you’ll have to play around with it a bit), you’ll be fine.

You want the mouse to be the target of focus along with the text, so keeping the size balance is important.

TextScaled is not a 1 size fits all solution, as you’ll always have text that is either too long and causes the text to get smaller, or text that is too big and causes it to remove all visual padding.

#5

I don’t get it. What’s your solution. Text-Scaled = false?

#6

I think a good solution to this would be to set the GUI buttons to have a based pixel size, since across devices you don’t want the buttons to be too small or large.

You can also opt out of adding the grey text label to mobile as they cannot hover over GUI elements, rather they can only press and hold.

#7

mobile or not is irrelavent. I just the text to for example take up 90% of the TextLabel on any screen size

#8

Set the TextLabel to TextScaled = true -- Scales the text based off the size,
Put the AnchorPoint to 0.5, 0.5 -- Makes the origin of the text label the center
Set the Position to {0.5, 0}, {0.5,0} -- Puts the origin in the middle of the frame
Set the Size to {1, 0}, {0.9, 0} -- Sets text table to 90% of height

#9

You’re saying to parent the textlabel to a frame but if I parented it to a frame then the frame wouldn’t automatically resize based on the length of the text. Textlabels can resize based on the size of the text with AutomaticSize = X but if it’s in a frame then the frame can’t do that

#10

I’ve found a solution. All I had to do was put blank spaces at the start and the end of the word

" " .. Text .. " "

this adds x padding making the text less squashed inside the textlabel

#11

There’s technically a better solution which is using a preexisting UIConstraint called UIPadding.

It’s very handy and allows you to add padding on all 4 sides.

1 Like
#12

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.