How do i make a fade in and out for a UI (Frame?)?

  1. What do you want to achieve? i want the ui fade in if visible is true and fade out if its not
    Captura de pantalla 2024-06-03 162735
    GameModes.ModeTitle.Background and GameModes.Modes.Background must fade with the uistroke too

  2. What is the issue? i cant do it

  3. What solutions have you tried so far? none

local function playEntered()
	currentCamera.CFrame = menuCamera.CFrame
end

playButton.MouseButton1Click:Connect(function(player)
	task.wait(0.01)
	local gameModes = script.Parent.MainMenu:WaitForChild("GameModes")
	gameModes.Visible = not gameModes.Visible
end)

tell me if this is wrong category

Well, you’ll have to tween the BackgroundTransparency property - you cannot animate with the visibility.

local ts = game:GetService("TweenService")

local info = TweenInfo.new(
    1, --duration in seconds
    Enum.EasingStyle.Sine, --animation method,
    Enum.EasingDirection.Out, --how the EasingStyle should be applied
    0, --repeat count
    false, --reverses
    0 --delay time
)

local openTween = ts:Create(frame, info, {BackgroundTransparency = 0})
local closeTween = ts:Create(frame, info, {BackgroundTransparency = 1})

--then...
openTween:Play()
closeTween:Play()

You would make tweens for each individual element, potentially storing them as an array.
You said you looked for nothing before making this - please do some research next time.
Here’s the documentation:
TweenService | Documentation - Roblox Creator Hub

2 Likes

Alright, i’ll do some research next time (also i had to change the script a little), thanks!

1 Like