Added a dynamic layout system where UI elements can be moved about on a tiled grid.

2026-11-09 18:14:52 +01:00
1 parent ea6ba54666
commit 26c29df4ad
@@ -0,0 +1,35 @@
+[gd_scene format=3]
+
+[ext_resource type="Script" path="res://scripts/camera_layout_frame.gd" id="1"]
+
+[node name="CameraSlot" type="VBoxContainer"]
+theme_override_constants/separation = 8
+
+[node name="Header" type="HBoxContainer" parent="."]
+layout_mode = 2
+
+[node name="Title" type="Label" parent="Header"]
+layout_mode = 2
+size_flags_horizontal = 3
+text = "CAMERA / PRIMARY"
+theme_override_font_sizes/font_size = 20
+
+[node name="State" type="Label" parent="Header"]
+layout_mode = 2
+text = "NO STREAM"
+
+[node name="Frame" type="AspectRatioContainer" parent="."]
+unique_name_in_owner = true
+layout_mode = 2
+ratio = 1.7777778
+script = ExtResource("1")
+
+[node name="Placeholder" type="PanelContainer" parent="Frame"]
+layout_mode = 2
+
+[node name="Label" type="Label" parent="Frame/Placeholder"]
+layout_mode = 2
+text = "16:9 CAMERA\nReserved video surface"
+horizontal_alignment = 1
+vertical_alignment = 1
+theme_override_font_sizes/font_size = 24
@@ -0,0 +1,52 @@
+[gd_scene format=3 uid="uid://dscdhba74otou"]
+
+[ext_resource type="Script" uid="uid://bqrapdh6yddl8" path="res://scripts/layout_canvas.gd" id="1"]
+[ext_resource type="Script" uid="uid://cwbk5g4yhdfd6" path="res://scripts/layout_edit_overlay.gd" id="2"]
+
+[node name="LayoutCanvas" type="Control" unique_id=325333537]
+clip_contents = true
+layout_mode = 3
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 2
+script = ExtResource("1")
+legacy_config_path = null
+
+[node name="EditOverlay" type="Control" parent="." unique_id=162710218]
+visible = false
+z_index = 120
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+mouse_filter = 2
+script = ExtResource("2")
+
+[node name="Actions" type="HBoxContainer" parent="EditOverlay" unique_id=846269020]
+visible = false
+layout_mode = 0
+offset_right = 112.0
+offset_bottom = 36.0
+theme_override_constants/separation = 2
+
+[node name="Settings" type="Button" parent="EditOverlay/Actions" unique_id=1387368158]
+custom_minimum_size = Vector2(36, 36)
+layout_mode = 2
+tooltip_text = "Settings (not available yet)"
+disabled = true
+text = "⚙"
+
+[node name="Resize" type="Button" parent="EditOverlay/Actions" unique_id=1301115821]
+custom_minimum_size = Vector2(36, 36)
+layout_mode = 2
+tooltip_text = "Drag to resize"
+text = "↘"
+
+[node name="Delete" type="Button" parent="EditOverlay/Actions" unique_id=1936216385]
+custom_minimum_size = Vector2(36, 36)
+layout_mode = 2
+tooltip_text = "Remove panel from layout"
+text = "×"
@@ -0,0 +1,12 @@
+[gd_scene format=3]
+
+[ext_resource type="Script" path="res://scripts/layout_item.gd" id="1"]
+
+[node name="LayoutItem" type="Control"]
+layout_mode = 0
+script = ExtResource("1")
+
+[node name="Background" type="Panel" parent="."]
+layout_mode = 0
+mouse_filter = 2
+theme_type_variation = &"LayoutItemBackground"
@@ -0,0 +1,66 @@
+[gd_scene format=3]
+
+[ext_resource type="Script" path="res://scripts/layout_library.gd" id="1"]
+
+[node name="LayoutLibrary" type="PanelContainer"]
+visible = false
+z_index = 300
+layout_mode = 1
+anchor_left = 1.0
+anchor_right = 1.0
+offset_left = -424.0
+offset_top = 80.0
+offset_right = -24.0
+offset_bottom = 720.0
+theme_type_variation = &"VehicleBackground"
+script = ExtResource("1")
+
+[node name="Margin" type="MarginContainer" parent="."]
+layout_mode = 2
+theme_override_constants/margin_left = 16
+theme_override_constants/margin_right = 16
+theme_override_constants/margin_top = 12
+theme_override_constants/margin_bottom = 12
+
+[node name="Body" type="VBoxContainer" parent="Margin"]
+layout_mode = 2
+theme_override_constants/separation = 12
+
+[node name="Header" type="HBoxContainer" parent="Margin/Body"]
+layout_mode = 2
+
+[node name="Title" type="Label" parent="Margin/Body/Header"]
+layout_mode = 2
+size_flags_horizontal = 3
+text = "ELEMENT LIBRARY"
+theme_override_font_sizes/font_size = 20
+
+[node name="Close" type="Button" parent="Margin/Body/Header"]
+layout_mode = 2
+text = "×"
+tooltip_text = "Close library"
+
+[node name="List" type="ItemList" parent="Margin/Body"]
+custom_minimum_size = Vector2(0, 180)
+layout_mode = 2
+size_flags_vertical = 3
+theme_type_variation = &"LayoutLibraryList"
+same_column_width = true
+fixed_icon_size = Vector2i(24, 24)
+
+[node name="Description" type="Label" parent="Margin/Body"]
+custom_minimum_size = Vector2(0, 78)
+layout_mode = 2
+autowrap_mode = 3
+
+[node name="Size" type="Label" parent="Margin/Body"]
+layout_mode = 2
+
+[node name="Status" type="Label" parent="Margin/Body"]
+layout_mode = 2
+autowrap_mode = 3
+
+[node name="Add" type="Button" parent="Margin/Body"]
+layout_mode = 2
+text = "Add element"
+tooltip_text = "Place in the first available space, using the minimum size if needed"
@@ -0,0 +1,81 @@
+[gd_scene format=3]
+
+[ext_resource type="Script" path="res://scripts/layout_overview.gd" id="1"]
+[ext_resource type="Script" path="res://scripts/layout_grid.gd" id="2"]
+
+[ext_resource type="Shader" path="res://shaders/layout_grid.gdshader" id="3"]
+
+[ext_resource type="PackedScene" path="res://components/layout_library.tscn" id="library"]
+
+[sub_resource type="ShaderMaterial" id="GridMaterial"]
+resource_local_to_scene = true
+shader = ExtResource("3")
+
+[node name="LayoutOverview" type="Control"]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+script = ExtResource("1")
+
+[node name="Dashboard" type="Control" parent="."]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
+[node name="Grid" type="ColorRect" parent="Dashboard"]
+visible = false
+material = SubResource("GridMaterial")
+z_index = 100
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 0
+script = ExtResource("2")
+
+[node name="Toolbar" type="HBoxContainer" parent="."]
+visible = false
+z_index = 200
+layout_mode = 1
+anchor_right = 1.0
+offset_left = 24.0
+offset_top = 16.0
+offset_right = -24.0
+offset_bottom = 60.0
+mouse_filter = 2
+theme_override_constants/separation = 20
+
+[node name="Title" type="Label" parent="Toolbar"]
+layout_mode = 2
+size_flags_horizontal = 3
+mouse_filter = 2
+theme_override_font_sizes/font_size = 20
+text = "LAYOUT OVERVIEW"
+
+[node name="Hint" type="Label" parent="Toolbar"]
+layout_mode = 2
+mouse_filter = 2
+text = "Esc to return"
+
+[node name="Add" type="Button" parent="Toolbar"]
+layout_mode = 2
+text = "Add element"
+
+[node name="Reset" type="Button" parent="Toolbar"]
+layout_mode = 2
+text = "Reset layout"
+
+[node name="Return" type="Button" parent="Toolbar"]
+layout_mode = 2
+text = "Return to dashboard"
+
+[node name="Library" parent="." instance=ExtResource("library")]
+layout_mode = 1
@@ -0,0 +1,30 @@
+[gd_scene format=3 uid="uid://u014ihs685mq"]
+
+[ext_resource type="Script" uid="uid://btaf1ke22k5ij" path="res://scripts/layout_slot.gd" id="1"]
+
+[node name="LayoutSlot" type="PanelContainer" unique_id=241401501]
+custom_minimum_size = Vector2(0, 100)
+theme_type_variation = &"VehicleBackground"
+script = ExtResource("1")
+
+[node name="Margin" type="MarginContainer" parent="." unique_id=1948608899]
+layout_mode = 2
+theme_override_constants/margin_left = 16
+theme_override_constants/margin_top = 12
+theme_override_constants/margin_right = 16
+theme_override_constants/margin_bottom = 12
+
+[node name="Text" type="VBoxContainer" parent="Margin" unique_id=764454736]
+layout_mode = 2
+theme_override_constants/separation = 12
+
+[node name="Title" type="Label" parent="Margin/Text" unique_id=806114057]
+unique_name_in_owner = true
+layout_mode = 2
+theme_override_font_sizes/font_size = 20
+text = "RESERVED"
+
+[node name="Description" type="Label" parent="Margin/Text" unique_id=592619421]
+unique_name_in_owner = true
+layout_mode = 2
+autowrap_mode = 3