Notched Screen Support - FULL RELEASE

Have only testing iOS. Have not tried android.

Workaround @reddiamondshield suggested worked

2 Likes

Using input.Position with a SurfaceGui.Frame.InputBegan(input) makes the input.Position.X offset by the notch’s x size (so the position is off)

My phone had this problem, but i didn’t find it as a BIG problem, but still it would be great seeing it fixed!

Hey there we are having some major issues and inconsistencies with this new update. Some of our UI is completely wrecked.
Some pics of some minor issues:



Ui is being randomly squished in and out. (Yes those buttons are under the same screen gui)

1 Like

Hey there, is there anyway to disable this completely until we can adjust the UI to work with notched screens?

1 Like

Just set all your ScreenGui’s ScreenInsets property to “None”.

2 Likes

Hi, the inventory/backpack item dragging bug should be fixed now! Please let us know if it isn’t fixed for you or you see some other bugs. Thanks!

3 Likes

Hi, thanks for reporting this! I have made a ticket for this issue and will update you when it’s fixed!

1 Like

2023 dec and roblox still hasnt fixed 2d objects AbsolutePosition property to addapt to the topbar area, and now it adds tons of extra complexity for devs to try to guess what the added offset should be.

I see no way to get the size of the topbar area or the size of the lateral areas to fix my elements positions

1 Like

Hi, thanks for reporting your concern with AbsolutePosition! Would you be able to share a specific usecase where AbsolutePosition isn’t working as you would expect it to?

It also sounds like you are trying to get the size/position of the Roblox top bar in order to adapt your UI to it. We actually have added a new API currently in beta, GuiService.TopbarInset which exposes a Rect datatype of the “safe area” within the top bar that is unoccupied by Roblox buttons:

1fb411b872082fda9361a65070ab3daf23cb59c0

So this “TopbarInset” area could be used to position custom buttons at the top of the screen.

You can also set ScreenGui.ScreenInsets=TopbarSafeInsets (currently in beta) to create a ScreenGui where the contents are the safe area of the top bar. (Documentation here).

With regards to the left/right safe area insets due to screen cutouts, our goal is to make it easy to anchor UI to the device safe area edges, shown in purple here:

You can achieve this by adding GuiObjects in a ScreenGui with ScreenGui.ScreenInsets=DeviceSafeInsets. The GuiObject’s Position property then sets its position relative to the safe area boundaries.

So, for the simple usecase described here, the GuiBase2d.AbsolutePosition property isn’t actually used.

Just for some more background on the AbsolutePosition property, we recently updated the behavior of GuiBase2d.AbsolutePosition on notched devices in order to preserve backwards-compatibility with existing lua scripts. Here is a diagram showing the changes:

So the AbsolutePosition coordinate system origin is at the bottom-left of the top bar.

For advanced users who would like to measure the left/right sizes of the safe area, you can use the code provided in the original post here.

5 Likes

The provided function “getHardwareSafeAreaInsets()” does help solving the problem but then I need to ask A LOT that Roblox make it a built-in function, and also making AbsolutePosition a writeable property would simplify our lives a lot.

Currently I rely on AbsolutePosition mainly to create lines between different 2d objects that are under different parents, and sometimes under different ScreenGui’s with different “IgnoreGuiInset” values; and to create a “take and drag item” behaviour between inventory-like slots. Therefore knowing the offset sizes that should be guessed out of AbsolutePositions is a core need.

2 Likes

Hello,

A small white square appears on the bottom left notched area when my keyboard is opened. It’s size will get bigger the bigger my keyboard is and smaller the smaller my keyboard is and it will not appear when the icons like the menu and the chat icons are completely visible. This happens on every game. My phone is Samsung Galaxy M12. Here are screenshots for reference:

3 Likes

Yes this would be useful :slight_smile: After failing to find anything in the docs I came to this topic looking specifically for an API which lets me query the screen inset sizes.

2 Likes

Having some weird white edges and corners while emulating notched screen devices.

When testing the game it looks even weirder:



Also shouldn’t this feature be removed from the beta features tab now that its fully released?

4 Likes

1 Year later, Still seeing the black part, even if i turned on Full Screen, then rejoin, it automatically turn off the full screen option.

Please help

1 Like

Hi, this bug should be fixed now in the latest version of Studio!

2 Likes

Hmm sorry to hear this isn’t working! I had a few questions if you have a chance:

Is this occurring 100% of the time for you, or only sometimes? Also, is your device iOS or Android?
Would you be able to provide some repro steps to see the black bar? For example, are you seeing the black bar only on rejoin?

Also please note that notch support is on for 95% of users, so it is possible you are in the 5% without notch support. Could you try logging into a different account to see if that gives you notch support?

1 Like

Im using the Latest iOS (17.4), And since I downloaded Roblox, its the same thing. I tried turning on the Fullscreen option, when I rejoin it automatically turns into Fullscreen off. And toggling the full screen option doesn’t change anything.

Tried an alt account, same thing. I hope I get included on that 95%, The black cutout really looks bad.

1 Like

Hi all, just wanted to provide an update that we’re rolling out notch support to 100% of users today :iphone:! (Previously we were at 95% rollout.)

Please let me know if you get any reports of notch support not working!

4 Likes

This topic was automatically closed 120 days after the last reply. New replies are no longer allowed.