Import SafeMarginContainer from Nanogolf and Swear Jar

main.tscn

@@ -1,6 +1,18 @@
-[gd_scene load_steps=2 format=3 uid="uid://b38wkla8e7rmo"]
+[gd_scene load_steps=3 format=3 uid="uid://b38wkla8e7rmo"]
 
 [ext_resource type="Script" path="res://main.gd" id="1_jyg3q"]
+[ext_resource type="PackedScene" uid="uid://bkm7id1wdwywg" path="res://scenes/interface/safe_margin_container.tscn" id="2_ah6n8"]
 
 [node name="Main" type="Node"]
 script = ExtResource("1_jyg3q")
+
+[node name="PrimaryCanvas" type="CanvasLayer" parent="."]
+
+[node name="SafeMarginContainer" parent="PrimaryCanvas" instance=ExtResource("2_ah6n8")]
+min_margin_left = 16
+min_margin_right = 16
+min_margin_top = 16
+min_margin_bottom = 16
+
+[node name="Panel" type="Panel" parent="PrimaryCanvas/SafeMarginContainer"]
+layout_mode = 2

project.godot

@@ -11,6 +11,7 @@ config_version=5
 [application]
 
 config/name="LD55"
+run/main_scene="res://main.tscn"
 config/features=PackedStringArray("4.2", "GL Compatibility")
 config/icon="res://icon.svg"
 

scenes/interface/safe_margin_container.gd

@@ -0,0 +1,59 @@
+extends MarginContainer
+class_name SafeMarginContainer
+
+## Ensures its children don't overlap any display cutout, such as the bezels of a mobile phone.
+
+
+## Minimum pixel margin that the UI should have from the left side of the screen.
+@export var min_margin_left: int
+
+## Minimum pixel margin that the UI should have from the right side of the screen.
+@export var min_margin_right: int
+
+## Minimum pixel margin that the UI should have from the top side of the screen.
+@export var min_margin_top: int
+
+## Minimum pixel margin that the UI should have from the bottom side of the screen.
+@export var min_margin_bottom: int
+
+
+var margin_left: int:
+	get:
+		return get_theme_constant("margin_left")
+	set(value):
+		add_theme_constant_override("margin_left", value)
+
+var margin_right: int:
+	get:
+		return get_theme_constant("margin_right")
+	set(value):
+		add_theme_constant_override("margin_right", value)
+
+var margin_top: int:
+	get:
+		return get_theme_constant("margin_top")
+	set(value):
+		add_theme_constant_override("margin_top", value)
+
+var margin_bottom: int:
+	get:
+		return get_theme_constant("margin_bottom")
+	set(value):
+		add_theme_constant_override("margin_bottom", value)
+
+
+
+func _ready():
+	# Cutouts are broken on desktop platforms...
+	if len(DisplayServer.get_display_cutouts()) == 0:
+		margin_left = min_margin_left
+		margin_right = min_margin_right
+		margin_top = min_margin_top
+		margin_bottom = min_margin_bottom
+	else:
+		var screen: Vector2i = DisplayServer.screen_get_size()
+		var rect: Rect2i = DisplayServer.get_display_safe_area()
+		margin_left = max(min_margin_left, rect.position.x)
+		margin_right = max(min_margin_right, screen.x - rect.end.x)
+		margin_top = max(min_margin_top, rect.position.y)
+		margin_bottom = max(min_margin_bottom, screen.y - rect.end.y)

scenes/interface/safe_margin_container.tscn

@@ -0,0 +1,11 @@
+[gd_scene load_steps=2 format=3 uid="uid://bkm7id1wdwywg"]
+
+[ext_resource type="Script" path="res://scenes/interface/safe_margin_container.gd" id="1_57nrw"]
+
+[node name="SafeMarginContainer" type="MarginContainer"]
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+script = ExtResource("1_57nrw")