How do I fix broken ZIndex layering?

In the game I’ve been working on, there’s a main menu where when you click the play button, the game fades to a black screen with a little message for a few seconds before fading back and you’re in the game. The problem is, however, that no matter what I do with the ZIndex, the black screen is under the main menu, like this:

Anyone know what to do about this? The ZIndex of the black screen is 5, while everything else on the screen is 1. The ScreenGuis are set to global ZIndexBehavior, and the black screen and main menu GUI are in different ScreenGuis.

ZIndex determines the order in which decals on the same Decal/Face|Face of a BasePart are rendered. Decals are rendered in ascending priority order, where the lower values are rendered first. Therefore, a decal with a higher ZIndex renders later (and on top of) other Decals with lower ZIndex.

I understand that. As stated in my original post,

Therefore, the black screen should be on top of the game logo, play button, and flashing light warning. The issue is that it’s not.

Ok so your saying the original look to the GUI is the picture you have, but when the button is pressed you want everything else to fade and just the black screen to remain until the game starts?

No, the picture in the first post what happens after the play button is pressed, when there’s only supposed to be the black screen showing. The original look is this:


(The camera rotates around the map)

Ok so if I’m understanding you currently can’t you just Tween the black screen when Play is pressed

local TweenService = game:GetService('TweenService')
local Frame = script.Parent

TweenService:Create(
    Frame, -- UI object you're tweening, in this case it's Frame
    TweenInfo.new(2), -- Amount of seconds
    {BackgroundTransparency = 1} -- Goal
):Play() -- Plays your tween

That’s what I do. Again, the problem is that the menu (The play button, logo, lights warning) continues to be in front the black screen when I tween the black screen to be visible, despite the black screen having a higher ZIndex value.

ok so would it be to much to just add in a tween, to tween them out as the black screen tweens in?

i always have problems with Zindex order, i stopped using it

I could do that, but that would be extra work for me and extra processing power for anyone playing the game. I’d rather use an in-built function designed to do what I want the game to do.

I gotcha, ill see if i come up with something for you, if someone hasn’t helped before I’m done. I’ll posted ASAP.

1 Like

You’ll want to change “DisplayOrder” on the actual ScreenGui of the black screen to be in front of the one with the menu.

Another thing I’d personally enable is “IgnoreGuiInset” so the black screen extends past the Roblox bar so the entire screen can be black, and not with the small sliver of the map at the top.

1 Like

Please set DisplayOrder.

1 Like

Ah, I knew it couldn’t be that complicated. For both of those things, really. Thanks for helping, all 3 of you.

3 Likes