How do I make it so UI appears after the loading screen?

[DevRaph]

I’m creating this rpg game. So far there is a loading screen which counts all descendants and a in game menu bar.
At the moment, the UI menu bar appears upon joining the game. I would like it so that the menu appears after the loading screen disappears.

This is what it looks like:

Here’s what I want to happen:

Loading screen loads, then disappears

All other UI and the menu bar appears, when the loading screen has disappeared.

Here is the code for the loading screen:

local replicatedFirst = game:GetService("ReplicatedFirst")
local contentProvider = game:GetService("ContentProvider")
local tweenService = game:GetService("TweenService")
local players = game:GetService("Players")

local player = players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")
local loadingScreen = script:WaitForChild("LoadingScreen")

replicatedFirst:RemoveDefaultLoadingScreen()

repeat task.wait() until game:IsLoaded()

local assets = game:GetDescendants()

local clonedLoadingScreen = loadingScreen:Clone()
clonedLoadingScreen.Parent = playerGui

tweenService:Create(clonedLoadingScreen.Background.GameTitle, TweenInfo.new(1, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut, -1, true), {Position = UDim2.fromScale(clonedLoadingScreen.Background.GameTitle.Position.X.Scale, clonedLoadingScreen.Background.GameTitle.Position.Y.Scale + 0.02)}):Play()

for i = 1, #assets do
	local asset = assets[i]
	local percentage = math.round(i / #assets * 100)
	
	contentProvider:PreloadAsync({asset})
	
	clonedLoadingScreen.Background.DisplayPercentage.Text = percentage.."%"
	clonedLoadingScreen.Background.DisplayAssetsLoaded.Text = "Loading Assets: "..i.."/"..#assets
	
	tweenService:Create(clonedLoadingScreen.Background.BarBackground.Bar, TweenInfo.new(0.2,Enum.EasingStyle.Sine, Enum.EasingDirection.Out), {Size = UDim2.fromScale(percentage/100, 1)}):Play()
	
	if i % 10 == 0 then
		task.wait()	
	end
	
	if i == #assets then
		task.wait(1)
	end
end

for i, v in pairs(clonedLoadingScreen:GetDescendants()) do
	if v:IsA("Frame") then
		tweenService:Create(v, TweenInfo.new(0.5), {BackgroundTransparency = 1}):Play()
	elseif v:IsA("TextLabel") then
		tweenService:Create(v, TweenInfo.new(0.5), {TextTransparency = 1}):Play()
	elseif v:IsA("UIStroke") then
		tweenService:Create(v, TweenInfo.new(0.5), {Transparency = 1}):Play()
	end
end

This is the menu bar object

I appreciate your help

[NefariouslyScripted (w_o)]

Have you tried increasing the loading screen zindex higher than the GUI on the bottom left corner?

[DevRaph]

The loading screen is in ReplicatedFirst and the menu bar is in StarterGui

[DevRaph]

how would I do this?********************

[NefariouslyScripted (w_o)]

Disable the MainFrame visibility and have the code for the loading screen enable the visibility in the properties of the MainFrame once the loading is done.

[DevRaph]

local replicatedFirst = game:GetService("ReplicatedFirst")
local contentProvider = game:GetService("ContentProvider")
local tweenService = game:GetService("TweenService")
local players = game:GetService("Players")

local player = players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")
local loadingScreen = script:WaitForChild("LoadingScreen")

replicatedFirst:RemoveDefaultLoadingScreen()

repeat task.wait() until game:IsLoaded()

local assets = game:GetDescendants()

local clonedLoadingScreen = loadingScreen:Clone()
clonedLoadingScreen.Parent = playerGui

tweenService:Create(clonedLoadingScreen.Background.GameTitle, TweenInfo.new(1, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut, -1, true), {Position = UDim2.fromScale(clonedLoadingScreen.Background.GameTitle.Position.X.Scale, clonedLoadingScreen.Background.GameTitle.Position.Y.Scale + 0.02)}):Play()

for i = 1, #assets do
	local asset = assets[i]
	local percentage = math.round(i / #assets * 100)
	
	contentProvider:PreloadAsync({asset})
	
	clonedLoadingScreen.Background.DisplayPercentage.Text = percentage.."%"
	clonedLoadingScreen.Background.DisplayAssetsLoaded.Text = "Loading Assets: "..i.."/"..#assets
	
	tweenService:Create(clonedLoadingScreen.Background.BarBackground.Bar, TweenInfo.new(0.2,Enum.EasingStyle.Sine, Enum.EasingDirection.Out), {Size = UDim2.fromScale(percentage/100, 1)}):Play()
	
	if i % 10 == 0 then
		task.wait()	
	end
	
	if i == #assets then
		task.wait(1)
	end
end

for i, v in pairs(clonedLoadingScreen:GetDescendants()) do
	if v:IsA("Frame") then
		tweenService:Create(v, TweenInfo.new(0.5), {BackgroundTransparency = 1}):Play()
	elseif v:IsA("TextLabel") then
		tweenService:Create(v, TweenInfo.new(0.5), {TextTransparency = 1}):Play()
	elseif v:IsA("UIStroke") then

> 		tweenService:Create(v, TweenInfo.new(0.5), {Transparency = 1}):Play()
**Would I need to add something here to enable the menu?**
end
end

[DevRaph]

I’m just not really sure how to do it or what to write

[NefariouslyScripted (w_o)]

player.PlayerGui.InGameMenu.MainFrame.Visible = true
Put this line in the function or where ever the code ends the loading screen.

If you want that whole GUI to not be visible until the loading screen is over, then disable “InGameMenu” (the screengui) and use this line instead; player.PlayerGui.InGameMenu.Enabled = true

[Koiyukki (Koyukki)]

Why don’t you just set the loading screen GUI’s display order to a higher index than your main GUI…?

[NefariouslyScripted (w_o)]

Because the loading screen and the button is in a different screen GUI and it doesn’t affect anything if it parent is apart from different screen gui.

[DevRaph]

It worked! Thanks for your help

[NefariouslyScripted (w_o)]

Glad to help. **********************

[Koiyukki (Koyukki)]

I know they are in different parents? What’s why I said DisplayOrder and not ZIndex?

[NefariouslyScripted (w_o)]

Sorry, didn’t see display order.

[DevRaph]

That also works but its still technically there. If I use player.PlayerGui.InGameMenu.Enabled = true
It won’t be there until the loading screen has finished. With the display order if I just hover my mouse I can see that the menu is still there

[Koiyukki (Koyukki)]

What…? If buttons are being fired from underneath your loading UI, then I recommend you set the active property to true.

[Koiyukki (Koyukki)]

By setting the active property to true; you also stop any screen / mouse inputs being fired from underneath the UI, which is ideal for loading screens.