如何在 roblox studio 中使 GUI 淡入淡出？

Question

您好，roblox 工作室的编剧们，

我是一名中级脚本编写者，需要一些游戏 GUI 方面的帮助。

我有一个带有播放按钮的开始屏幕，如下所示：

我试图在单击按钮时淡出 GUI，但所有教程都不起作用。这是我的按钮脚本：

local button = script.Parent
local gui = script.Parent.Parent.Parent

button.MouseButton1Down:Connect(function()
    gui.Enabled = false
end)

我不知道如何更改，会是BackgroundTransparency吗？如何以 0.01 为增量将透明度从 0 更改为 1？

我尝试使用 for 循环使 gui 淡入淡出，更改背景透明度，但这不起作用，这就是代码：

local button = script.Parent
local gui = script.Parent.Parent.Parent

button.MouseButton1Down:Connect(function()
    for i = 0, 100, 1 do
        gui.Frame.BackgroundTransparency + 0.01
        wait(0.01)
        gui.Enabled = false
    end
end)

我不知道为什么它不起作用。 如果我有错别字或其他什么，请告诉我。 谢谢！

Answer 1

循环解决方案有一些拼写错误，这里已修复：

local button = script.Parent
local gui = script.Parent.Parent.Parent

button.MouseButton1Down:Connect(function()
    for i = 0, 100 do
        gui.Frame.BackgroundTransparency += 0.01 -- += adds 0.01 each time
        task.wait(0.01) -- better than wait(0.01)
    end
    gui.Enabled = false
end)

然而，这并不是一个理想的解决方案。更好的系统将使用 Roblox 的 TweenService 来更改 gui 的透明度。补间不那么抖动，更容易修改，并且具有许多自定义属性，包括重复、更改时间长度和缓动样式（例如，一开始速度更快，然后在接近尾声时速度变慢；请参阅 Roblox 文档上的Easing Styles） ).

local TweenService = game:GetService("TweenService")

local button = script.Parent
local gui = script.Parent.Parent.Parent

local tweenInfo = TweenInfo.new(
    2, -- Time
    Enum.EasingStyle.Linear, -- Easing Style
    Enum.EasingDirection.Out -- Easing Direction
    -- See https://create.roblox.com/docs/reference/engine/datatypes/TweenInfo for more available properties
)

local tween = TweenService:Create(
    gui.Frame, -- Instance to tween
    tweenInfo, -- TweenInfo
    { Transparency = 1 } -- What we want to change
)

button.MouseButton1Down:Connect(function()
    tween:Play()
    tween.Completed:Wait() -- Wait until tween is complete
    gui.Enabled = false
end)

虽然这两种解决方案都只改变背景的透明度，所以子元素（例如播放按钮）将保持可见，直到 GUI 被禁用。您可能希望用 CanvasGroup 替换 Frame，当其 GroupTransparency 属性更改时，它也会更改其子级的透明度。

local tween = TweenService:Create(
    gui.CanvasGroup, -- Instance to tween
    tweenInfo, -- TweenInfo
    { GroupTransparency = 1 } -- What we want to change
)

Answer 2

例如，我制作了一个屏幕图形用户界面并制作了脚本，但是当您按下文本按钮或任何按钮时，声音会如何？