로딩 화면 | 설명서 - Roblox 크리에이터 허브

Roblox는 사용자가 게임에 연결할 때 기본 로딩 화면을 표시하지만, 정적 또는 애니메이션 콘텐츠가 포함된 맞춤형 로딩 화면으로 게임을 개인화할 수 있습니다.

이 문서는 사용자가 게임에 처음 입장할 때 표시되는 로딩 화면을 다룹니다. 사용자가 장소 간에 텔레포트할 때 표시되는 로딩 화면을 사용자 지정하려면 장소 간 텔레포트를 참조하세요.

구현

사용자 지정 로딩 화면을 표시하려면 LocalScript 내에 ScreenGui 인스턴스를 직접 디자인하거나, 장소 계층 구조에서 ScreenGui 객체를 참조할 수 있습니다. 두 가지 옵션 모두 ReplicatedFirst를 사용하며, 이 서비스는 다른 모든 것이 복제되기 전에 클라이언트에 인스턴스를 복제합니다. 이를 통해 사용자가 게임에 들어갈 때 로딩 화면이 가장 처음 보이는 것입니다.

스크립트를 통한 구현

LocalScript에서만 사용자 지정 로딩 화면을 디자인하고 표시하려면 다음 단계를 따릅니다:

ReplicatedFirst에서 LocalScript를 생성합니다.
아래 코드를 붙여넣어 ScreenGui 객체를 만들고 사용자 지정합니다. 아래 코드를 자신의 값으로 수정하여 디자인을 생성할 수 있습니다.

스크립트로 생성한 로딩 화면
local Players = game:GetService("Players")
local ReplicatedFirst = game:GetService("ReplicatedFirst")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local loadingScreen = Instance.new("ScreenGui")
loadingScreen.IgnoreGuiInset = true
loadingScreen.Parent = playerGui

-- ScreenGui 값을 자신의 것으로 교체
local textLabel = Instance.new("TextLabel")
textLabel.Size = UDim2.new(1, 0, 1, 0)
textLabel.BackgroundColor3 = Color3.fromRGB(0, 20, 40)
textLabel.Font = Enum.Font.DenkOne
textLabel.TextColor3 = Color3.new(0.8, 0.8, 0.8)
textLabel.Text = "로딩 중"
textLabel.TextSize = 32
textLabel.Parent = loadingScreen

-- 기본 로딩 화면 제거
ReplicatedFirst:RemoveDefaultLoadingScreen()

task.wait(5)  -- 사용자 지정 로딩 화면이 최소 시간 동안 나타나도록 강제

if not game:IsLoaded() then
	game.Loaded:Wait()
end

loadingScreen:Destroy()

기존 GUI에서 구현

LocalScript를 통해 로딩 화면 ScreenGui를 완전히 생성하는 대신, 장소 계층 구조에서 기존의 ScreenGui를 참조할 수도 있습니다. 게임에 참조되는 ScreenGui가 ReplicatedFirst 내에 포함되어 있고, 해당 ScreenGui가 TextLabels 및 ImageLabels와 같은 UI 요소를 포함해야 하는지 확인하십시오.

이 프로세스를 보여주기 위해, 다음 LocalScript는 ReplicatedFirst 내의 LoadingScreen이라는 ScreenGui를 참조한 후 기본 로딩 화면을 제거하여 플레이어가 볼 수 있는 유일한 로딩 화면이 사용자 정의 로딩 화면이 되도록 합니다.

로딩 화면 ScreenGui를 미리보기 위해 StarterGui 컨테이너 내에서 디자인한 후, 결과에 만족하면 ReplicatedFirst로 이동할 수 있습니다.

기존 로딩 화면 참조
local Players = game:GetService("Players")
local ReplicatedFirst = game:GetService("ReplicatedFirst")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local loadingScreen = ReplicatedFirst:FindFirstChild("LoadingScreen")
if loadingScreen then
	loadingScreen.IgnoreGuiInset = true
	loadingScreen.Parent = playerGui

	-- 기본 로딩 화면 제거
	ReplicatedFirst:RemoveDefaultLoadingScreen()

	task.wait(5)  -- 화면이 최소 초 수 동안 나타나도록 강제

	if not game:IsLoaded() then
		game.Loaded:Wait()
	end

	loadingScreen:Destroy()
end

애니메이션 추가

정적 사용자 지정 로딩 화면 외에도 로딩 화면에 애니메이션을 추가하여 로딩 진행 상황을 나타낼 수 있습니다. 이를 가장 간단하게 구현하는 방법은 TextLabel 또는 ImageLabel과 같은 UI 요소를 만든 다음 이를 TweenService를 사용하여 애니메이션하는 것입니다. 예를 들어, 아래 코드는 자식 ImageLabel이 있는 새 ScreenGui를 만들고 기본 로딩 화면을 제거한 다음, TweenService가 중앙 요소를 페이드 인하고 회전시켜 게임이 로드될 때까지 진행하도록 합니다.

애니메이션이 포함된 스크립트로 생성한 로딩 화면
local Players = game:GetService("Players")
local ReplicatedFirst = game:GetService("ReplicatedFirst")
local TweenService = game:GetService("TweenService")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local loadingScreen = Instance.new("ScreenGui")
loadingScreen.IgnoreGuiInset = true
loadingScreen.Parent = playerGui

local textLabel = Instance.new("TextLabel")
textLabel.Size = UDim2.new(1, 0, 1, 0)
textLabel.BackgroundColor3 = Color3.fromRGB(0, 20, 40)
textLabel.Font = Enum.Font.DenkOne
textLabel.TextColor3 = Color3.new(0.8, 0.8, 0.8)
textLabel.Text = "로딩 중"
textLabel.TextSize = 32
textLabel.TextTransparency = 1
textLabel.Parent = loadingScreen

local loadingRing = Instance.new("ImageLabel")
loadingRing.Size = UDim2.new(0, 256, 0, 256)
loadingRing.BackgroundTransparency = 1
loadingRing.Image = "rbxassetid://4965945816"
loadingRing.AnchorPoint = Vector2.new(0.5, 0.5)
loadingRing.Position = UDim2.new(0.5, 0, 0.5, 0)
loadingRing.ImageTransparency = 1
loadingRing.Parent = loadingScreen

-- 기본 로딩 화면 제거
ReplicatedFirst:RemoveDefaultLoadingScreen()

-- 페이드 인 트윈 시작
local fadeTweenInfo = TweenInfo.new(1, Enum.EasingStyle.Quad, Enum.EasingDirection.Out, 0, false, 2)
local fadeTween1 = TweenService:Create(textLabel, fadeTweenInfo, {TextTransparency = 0})
local fadeTween2 = TweenService:Create(loadingRing, fadeTweenInfo, {ImageTransparency = 0})
fadeTween1:Play()
fadeTween2:Play()

-- 회전 트윈 시작
local tweenInfo = TweenInfo.new(4, Enum.EasingStyle.Linear, Enum.EasingDirection.In, -1)
local tween = TweenService:Create(loadingRing, tweenInfo, {Rotation = 360})
tween:Play()

task.wait(5)  -- 화면이 최소 초 수 동안 나타나도록 강제

if not game:IsLoaded() then
	game.Loaded:Wait()
end

loadingScreen:Destroy()