im tweening the size of some buttons and it doesn’t look smooth, im guessing its because it is tweening up by 1 pixel when sizing it? is there a way to get past this or are the buttons just too small? ty if you can help
the code (not really needed tho)
for i, v in ipairs(script.Parent.Main.Content.Frame:GetChildren()) do
if v:IsA('TextButton') then
v.MouseEnter:Connect(function()
v:TweenSize(UDim2.new(1,0,0,30), Enum.EasingDirection.Out, Enum.EasingStyle.Quad, 0.75, true)
game.SoundService.UI.UI_ButtonHover:Play()
end)
v.MouseLeave:Connect(function()
v:TweenSize(UDim2.new(1,0,0,23), Enum.EasingDirection.Out, Enum.EasingStyle.Quad, 0.75, true)
game.TweenService:Create(v, TweenInfo.new(0.5), {TextColor3 = Color3.new(1,1,1)}):Play()
end)
v.MouseButton1Up:Connect(function()
game.SoundService.UI.UI_ButtonRelease:Play()
game.TweenService:Create(v, TweenInfo.new(0.5), {TextColor3 = Color3.new(1,1,1)}):Play()
end)
v.MouseButton1Down:Connect(function()
game.TweenService:Create(v, TweenInfo.new(0.5), {TextColor3 = Color3.new(0.6,0.6,0.6)}):Play()
end)
end
end
oh also the same thing happens when tweening TextSize
I think that because of how the text is rendered it can only increase the size of the letters incrementally (example: a font size of 12.4 is the same as 12).
You could use a CanvasGroup to scale the text nicely, though I’m not sure if they’re live:
TextSize does not have subpixel scaling, which means it will round to the nearest size (so you can’t have a text size of 4.5, only 4 or 5). I’d suggest to use a UIScale to scale the text up instead.
the text size can only go up by whole numbers, example 0-1. Something you could try is enabling the TextScaled property inside of your TextLabel and then tweening the Size of your TextLabel. This will make the text change sizes smoothly. Make sure to mark this as the solution if it helped!
You should use UIScale to properly and smoothly animate your text on hover.
Here’s an example script :
local ts = game:GetService("TweenService")
local tweenInfo = TweenInfo.new(.25, Enum.EasingStyle.Quart, Enum.EasingDirection.Out)
function sizeAnimationEnter(btn)
-- Making it bigger
ts:Create(btn.UIScale, tweenInfo, {Scale = 1.1}):Play()
end
function sizeAnimationLeave(btn)
-- Making it smaller
ts:Create(btn.UIScale, tweenInfo, {Scale = 1}):Play()
end
script.Parent.MouseEnter:Connect(function()
-- If mouse hovers parent
sizeAnimationEnter(script.Parent)
end)
script.Parent.MouseLeave:Connect(function()
-- If mouse stops hovering parent
sizeAnimationLeave(script.Parent)
end)
To make this work, insert a UIScale into the text or button you want to animate and set the scale to 1.