sven
June 15, 2018, 3:27pm
1
Hi all!
I hacked together a minimal library that will resize the UIView (with constraints) based on “safe area ” on iOS. This should be a quick thing to add to a game/app, until you have added current GUI layouts.
The current state is very untested, so use at your own risk.
The source can be found here: GitHub - defold/extension-safearea: Simple native extension library for Defold that will change the view/render of a game to fit into the safe area on newer iPhones. https://github.com/defold/extension-safearea/archive/master.zip
The red color indicates safe area (ie the game being rendered), the yellow is the “background” color outside the safe area.
9 Likes
AGulev
September 27, 2021, 8:39am
2
Important updates for the extension:
New method safearea.get_insets() that returns the amount of “unsafe” space against each edge of the screen, in pixels (thanks @dapetcu21 !)
safearea.get_insets()now works for Android as well
Updated doc is available here: https://github.com/defold/extension-safearea/blob/master/docs/index.md
5 Likes
AGulev
October 14, 2021, 6:57am
3
version 1.3 released:
Now get_insets() method returns status value
local insets, status = safearea.get_insets()
-- The amount of "unsafe" space against each edge of the screen, in pixels
print(insets.top, insets.right, insets.bottom, insets.left)
-- Status is one of the following values:
-- safearea.STATUS_OK - value is avaliable and valid, you may fully trust it.
-- safearea.STATUS_NOT_AVAILABLE - functionality isn't available on this platform or OS version. Values will be 0
-- safearea.STATUS_NOT_READY_YET - values aren't ready yet. Depends on platform and OS it may take a while (usually up to 200ms) to be ready, check later. Values will be 0
# SafeArea
Simple native extension library for Defold that will change the view/render of a game to fit into the safe area on iPhones and Android(API 28+) with notch.
## Installation
To use this library in your Defold project, add the following URL to your `game.project` dependencies:
[https://github.com/defold/extension-safearea/archive/master.zip](https://github.com/defold/extension-safearea/archive/master.zip)
We recommend using a link to a zip file of a [specific release](https://github.com/defold/extension-safearea/releases).
## Usage:
### Easy mode (no change to your project, iOS only)
Just add the library to your project. The library will automatically resize the view on app start.
You can configure the color used outside the view by setting the `game.project` setting `safearea.background_*` values, for example;
```
[safearea]
show original
4 Likes
Lex
February 10, 2022, 2:48pm
4
The value I get for insets.top is twice as big as the notch itself.
If i divide the value by 2 I get the exact size of the notch, but I don’t know the reason behind this.
Is that a bug from the library or am I misusing it?
britzl
February 10, 2022, 3:16pm
5
Interesting. What is the size of your display in game project? And what is the size of your phone’s screen?
Lex
February 10, 2022, 3:19pm
6
Game project is 720x1280
britzl
February 10, 2022, 8:49pm
7
Please create a ticket in the repo and we’ll take a look!
Lex
February 11, 2022, 1:00pm
8
Is it possible to have a game Android where we display the game below the status bar?
I updated the android manifest with android:theme="@android:style/Theme.NoTitleBar"
so the status bar is showing correctly.
My problem is the game starts drawing BEHIND the status bar. Is there anyway too avoid that? (it would probably fix the notch issue I’m having).
AGulev
February 11, 2022, 1:04pm
9
Take a look these options in Android section
Lex
February 11, 2022, 1:05pm
10
I checked the “Display Cutout” on/off but it doesn’t make any difference
Lex
February 11, 2022, 1:12pm
11
This is my UI in the editor:
(the top bottom has pivot as NORTH.
My manifest is android:theme="@android:style/Theme.NoTitleBar"
Wether I check the “Display Cutout” or not, I get:
as you can see the top element is behind the status bar
(Also, I haven’t had time to create community page for it yet.)
