From 1efa5bc7d91ab7d158a1564541e2c253a5acf327 Mon Sep 17 00:00:00 2001 From: Zwitschi Date: Sun, 1 Nov 2026 16:19:18 +0100 Subject: [PATCH] Use the pause and settings mockups as panel backdrops Add UiArt.add_screen_backdrop() to place the reference art behind an opaque panel, then wire the pause overlay and settings screen to it. Pause rows get larger, rounded styles; settings widens to fit its expanded controls. Headless 226/226 verified in a clean HEAD worktree (the realism WIP currently editing materials.gd remains unstaged). --- TODO.md | 4 +++- src/game/ui/art.gd | 33 +++++++++++++++++++++++++++++++++ src/game/ui/pause_overlay.gd | 30 ++++++++++++++++++++++++------ src/game/ui/settings_panel.gd | 16 ++++++++++------ 4 files changed, 70 insertions(+), 13 deletions(-) diff --git a/TODO.md b/TODO.md index 722c954..5aaf851 100644 --- a/TODO.md +++ b/TODO.md @@ -46,7 +46,9 @@ and scene visuals with those mockups — verified with - [x] Add a central UI/scene art loader (e.g. `src/game/ui/art.gd`) that loads the mockup-derived images from the new runtime root, with a procedural fallback when a file is missing. - [x] Wire the start menu and venue selection screen to use the `start_menu` scene art. -- [ ] Wire the pause overlay, settings, shift review, radial menu, and HUD chrome to their reference images. +- [x] Wire the pause overlay to `pause_overlay` scene art (backdrop + opaque panel cover). +- [x] Wire the settings panel to `settings_panel` art. +- [ ] Wire the shift-review, radial-menu, and HUD chrome to their reference images. ### Align in-game visuals diff --git a/src/game/ui/art.gd b/src/game/ui/art.gd index dcce819..68c9caa 100644 --- a/src/game/ui/art.gd +++ b/src/game/ui/art.gd @@ -49,5 +49,38 @@ func texture_at(relative_path: String) -> Texture2D: _cache[path] = result return result +## Add a full-screen art backdrop plus an opaque panel covering the mockup's +## baked-in controls. `panel_rect` is normalised (0..1) screen coordinates. +## Returns false when the art is missing so the caller can keep its own backdrop. +func add_screen_backdrop(parent: Control, art_name: String, + panel_rect: Rect2, panel_color: Color = Color(0.075, 0.08, 0.095, 1.0)) -> bool: + var texture := texture(art_name) + if texture == null or parent == null: + return false + var backdrop := TextureRect.new() + backdrop.name = "ScreenArt" + backdrop.texture = texture + backdrop.expand_mode = TextureRect.EXPAND_IGNORE_SIZE + backdrop.stretch_mode = TextureRect.STRETCH_KEEP_ASPECT_COVERED + backdrop.set_anchors_preset(Control.PRESET_FULL_RECT) + backdrop.mouse_filter = Control.MOUSE_FILTER_IGNORE + parent.add_child(backdrop) + var panel := ColorRect.new() + panel.name = "ArtPanel" + panel.color = panel_color + panel.set_anchor(SIDE_LEFT, panel_rect.position.x) + panel.set_anchor(SIDE_TOP, panel_rect.position.y) + panel.set_anchor(SIDE_RIGHT, panel_rect.position.x + panel_rect.size.x) + panel.set_anchor(SIDE_BOTTOM, panel_rect.position.y + panel_rect.size.y) + panel.mouse_filter = Control.MOUSE_FILTER_IGNORE + parent.add_child(panel) + var dim := ColorRect.new() + dim.name = "ArtDim" + dim.color = Color(0.02, 0.03, 0.05, 0.16) + dim.set_anchors_preset(Control.PRESET_FULL_RECT) + dim.mouse_filter = Control.MOUSE_FILTER_IGNORE + parent.add_child(dim) + return true + func clear_cache() -> void: _cache.clear() diff --git a/src/game/ui/pause_overlay.gd b/src/game/ui/pause_overlay.gd index ffd1444..14b5618 100644 --- a/src/game/ui/pause_overlay.gd +++ b/src/game/ui/pause_overlay.gd @@ -9,6 +9,8 @@ signal restart_requested() signal settings_requested() signal quit_to_menu_requested() +const UiArt := preload("res://src/game/ui/art.gd") + var _root: Control = null var _resume_button: Button = null @@ -24,11 +26,14 @@ func _build() -> void: _root.mouse_filter = Control.MOUSE_FILTER_STOP add_child(_root) - var bg := ColorRect.new() - bg.color = Color(0.02, 0.03, 0.05, 0.82) - bg.set_anchors_preset(Control.PRESET_FULL_RECT) - bg.mouse_filter = Control.MOUSE_FILTER_IGNORE - _root.add_child(bg) + var art := UiArt.new() + if not art.add_screen_backdrop(_root, "pause_overlay", + Rect2(0.172, 0.097, 0.59, 0.813)): + var bg := ColorRect.new() + bg.color = Color(0.02, 0.03, 0.05, 0.82) + bg.set_anchors_preset(Control.PRESET_FULL_RECT) + bg.mouse_filter = Control.MOUSE_FILTER_IGNORE + _root.add_child(bg) var center := CenterContainer.new() center.set_anchors_preset(Control.PRESET_FULL_RECT) @@ -60,7 +65,20 @@ func _add_button(parent: Control, text: String, node_name: String, cb: Callable) var button := Button.new() button.name = node_name button.text = text - button.custom_minimum_size = Vector2(320, 44) + button.custom_minimum_size = Vector2(380, 52) + button.add_theme_font_size_override("font_size", 22) + var normal := StyleBoxFlat.new() + normal.bg_color = Color(0.115, 0.125, 0.15, 0.96) + normal.corner_radius_top_left = 12 + normal.corner_radius_top_right = 12 + normal.corner_radius_bottom_left = 12 + normal.corner_radius_bottom_right = 12 + var hover := normal.duplicate() as StyleBoxFlat + hover.bg_color = Color(0.16, 0.175, 0.21, 0.98) + button.add_theme_stylebox_override("normal", normal) + button.add_theme_stylebox_override("hover", hover) + button.add_theme_stylebox_override("focus", hover) + button.add_theme_stylebox_override("pressed", hover) button.pressed.connect(cb) parent.add_child(button) return button diff --git a/src/game/ui/settings_panel.gd b/src/game/ui/settings_panel.gd index 3bd9758..01ef4d2 100644 --- a/src/game/ui/settings_panel.gd +++ b/src/game/ui/settings_panel.gd @@ -7,6 +7,7 @@ extends CanvasLayer ## and HUD as soon as the player confirms. const InputBindings := preload("res://src/core/input_bindings.gd") +const UiArt := preload("res://src/game/ui/art.gd") signal applied(settings: Dictionary) signal closed() @@ -39,18 +40,21 @@ func _build() -> void: _root.mouse_filter = Control.MOUSE_FILTER_STOP add_child(_root) - var bg := ColorRect.new() - bg.color = Color(0.02, 0.03, 0.05, 0.9) - bg.set_anchors_preset(Control.PRESET_FULL_RECT) - bg.mouse_filter = Control.MOUSE_FILTER_IGNORE - _root.add_child(bg) + var art := UiArt.new() + if not art.add_screen_backdrop(_root, "settings_panel", + Rect2(0.117, 0.049, 0.703, 0.895)): + var bg := ColorRect.new() + bg.color = Color(0.02, 0.03, 0.05, 0.9) + bg.set_anchors_preset(Control.PRESET_FULL_RECT) + bg.mouse_filter = Control.MOUSE_FILTER_IGNORE + _root.add_child(bg) var center := CenterContainer.new() center.set_anchors_preset(Control.PRESET_FULL_RECT) _root.add_child(center) var column := VBoxContainer.new() - column.custom_minimum_size = Vector2(420, 0) + column.custom_minimum_size = Vector2(640, 0) column.add_theme_constant_override("separation", 12) center.add_child(column)