Graceful text scaling

Feature Requests Engine Features
#1

At the moment it seems to be very difficult or even impossible to have text that scales gracefully while maintaining the exact same text content on each rendered line.

When text gets scaled, sometimes the text will render with one character (sometimes maybe more characters?) shifted back to the previous line. And also sometimes the end of the text will be cut off.

This makes it pretty ugly to have text that gets scaled dynamically (for animations or 3D displays).

It would be great if we could have some way to guarantee that the text will always stay the same shape and have the same content on each line when scaled.

To be clear, I believe this problem is unrelated to whether a UIScale is used or not. I think it’s more about the rendered size of the TextLabel and its rendered TextSize.

To see this yourself, run this code:

local ScreenGui = Instance.new("ScreenGui")
ScreenGui.ResetOnSpawn = false
ScreenGui.Parent = game.Players.LocalPlayer.PlayerGui

local TextLabel = Instance.new("TextLabel")
TextLabel.BackgroundColor3 = Color3.new(1, 1, 1)
TextLabel.Text = "ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZ"
TextLabel.Size = UDim2.fromOffset(218, 126)
TextLabel.Position = UDim2.fromScale(0.5, 0.5)
TextLabel.AnchorPoint = Vector2.new(0.5, 0.5)
TextLabel.TextWrapped = true
TextLabel.Font = Enum.Font.SourceSans
TextLabel.TextSize = 18
TextLabel.Parent = ScreenGui

local UIScale = Instance.new("UIScale")
UIScale.Parent = TextLabel

game:GetService("RunService").RenderStepped:Connect(function()
	UIScale.Scale = 1.4 + math.sin(os.clock())
end)
21 Likes
#2

Yeah the video you provided shows some pretty choppy text when it’s being scaled.

I don’t personally find this a problem but maybe I will in the future so I support this.

#3

I agree this would be annoying, but wouldn’t that be considered a bug? I don’t think they intentionally made it glitchy. :thinking:

#4

I would disagree that this behaviour can be considered a bug, however irritating it may be. The only reason why it appears glitchy like that so to speak is because the text content keeps changing on each line depending on the text scaling, which is constantly being set in this particular example.

#5

I agree with this, it makes UI tweening incredibly ugly sometimes.
In the meantime, to work around it, I use an image program to create a decal for the text and use that as an ImageLabel instead.
Unfortunately, this doesn’t work with expanding text lines.

#6

I used to do this, but my images kept getting moderated so, Just be careful when uploading images with text in.

1 Like
#7

A workaround would be to upload your text as an image. While the animation is playing, use the image instead of actual text. Then, if needed, switch back to regular text after the animation is complete. I would hope that the animation ends at some point, or that would be very hard to read… Personally I have never had a text-based image be moderated.

#8

Vouch, it would be nice to have text that scales very smoothly.

The workaround i use for this is via font spritesheets and a module that parses said sheet.
At the moment, i only used it for a RoFNF clone and an (upcoming) little project i’m making and i can tell you it’s the best workaround i’ve made.

The applications i use to get the image sprite sheets is the Bitmap Font Generator, specifically the Sprite Font Builder version by John Wordsmith, which provides you with the basic tools of adding outline and shadow effects.
Also you can import ANY font you want, as long it has the text data Module it needs to parse the sprite sheet and the ImageId.
You can also adjust the Maximum image resolution, in case you want to haul all the space you need without roblox scaling the image down.

The only current limitations is that the fonts are shown via ImageLabels, which makes adding gradients to all letters hard (with only other workaround is by using CanvasGroups instead of a frame), scaling is only supported via UDim2 scales (Target resolution is needed) and the depencency of a text module that can parse the font sprite sheet.

While i can’t provide videos right now, i can show you an image of the text being stretched out:

image
image1092×194 37.7 KB

1 Like
#9

Bump. It seems like Roblox text can’t render at non-integer TextSizes even with TextScaled, causing this issue; really annoying when trying to make text scale with any arbitrary AbsoluteSize or tweening a GUI.

3 Likes