How Do You Auto-Scale Text In a BillboardGui?

How Can You Auto-Scale Text In a BillboardGui?

  1. What do you want to achieve?
  • I am making a custom Name Gui (For Putting An Image In the Name) that needs to scale based on the amount of text.

  • I want it to auto-scale as the default one does:

  • The hardest thing would be not making the BillboardGui messes its size up.

  1. What solutions have you tried so far? I have tried looking at posts around this subject, but only found auto-scaling for normal GUIs. Because of that, I am currently stuck on this behavior.

    Using the TextBounds method, the Name BillboardGui size became an offset.
    Is it possible for this to become scaled? This might not be the way to do it.

    Code:

    local nameLabel = script.Parent
    local nameDisplayBillboard = nameLabel.Parent.Parent

    nameLabel:GetPropertyChangedSignal("Text"):Connect(function()
    	nameDisplayBillboard.Size = UDim2.new(
    		0,
    		nameLabel.TextBounds.X,
    		0,
    		nameLabel.TextBounds.Y
    	)
    end)
1 Like

Not sure if this is possible. Is there a way to put an image into the player’s name?

1 Like

I would just use the textscaled property which is more performant than having a changed event

2 Likes

The TextScaled property would look very good. But, would there be a way to scale the BillboardGui up for it to fit the text? I am going to implement it into an RP name system. So the name string would be very long.
Text here is too small.

1 Like

You could specifically change the Offset of the BillboardGui to 0 and change the Scale to the correct size in the script if this is what you need.

1 Like

You need to make the BillboardGui wider. When using the TextScaled property the text will grow to fit whichever axis allows the bigger size. As you can see in the image you sent, the text was as wide as the frame but much shorter than the frame because the size is bound by the smaller X axis. If you widen the frame by 2-3 times the text will have more room to grow and thus be taller (more readable).

1 Like

That is definitely a way to do it. But how should I scale the BillboardGui?

Change the size values of your Frame/TextLabel in the properties window.

I know how to do that. But not how much to increase the size depending on the X/Y size.

Just change whatever X value you have for size to be 2-3 times the current amount. It’s only a suggestion though, you can change the X value to whatever you like best.

1 Like

@AljoSven @Krysiene @rom8nn
Thanks to you guys for helping! I have chosen the solution to be from @AljoSven .
Here is the code that I ended up with:

-- Created by: Minhnormal

local STUDS_OFFSET_Y = 2

local nameLabel = script.Parent
nameLabel.TextScaled = true
nameLabel.Size = UDim2.new(1, 0, 1, 0)

local nameDisplayBillboard = nameLabel.Parent.Parent

local textScaleSize = Vector2.new(0.4, 0.42)

nameLabel:GetPropertyChangedSignal("Text"):Connect(function()
	-- Changing the size
	local amountOfCharacter = string.len(nameLabel.Text)
	local _, numberOfLines = string.gsub(nameLabel.Text, "\n", "\n")

	if amountOfCharacter == 0 then
		numberOfLines = 0
	else
		-- Adding the minimum of one line		
		numberOfLines += 1
	end
	
	nameDisplayBillboard.Size = UDim2.new(
		amountOfCharacter * textScaleSize.X,
		0,
		numberOfLines * textScaleSize.Y,
		0
	)
	
	-- Putting on studs offset:
	nameDisplayBillboard.StudsOffset = Vector3.new(0, STUDS_OFFSET_Y + nameDisplayBillboard.Size.Y.Scale, 0)
end)

-- Testing this out
nameLabel.Text = "Hi" .. "\n" .. "[name]"
2 Likes

Not too shabby :smiley:
One thing I would add to this is sizing to the exact horizontal size for the line that has the largest horizontal characters.