@tool class_name NeonPanel extends Control # A bounded dialog card drawn in the game's own style: a dark chamfered # body with a glowing border and bright corner brackets. Chamfered rather # than square because cut corners read as "console panel" and match the # hard-edged neon of the buttons and HUD. # # Draws itself from its own rect, so it can be sized freely in the scene. # # #92: it also SHRINKS itself to whatever window it is in. The card is # authored at a fixed size around a portrait phone, and on a landscape # window - where the canvas is far wider than it is tall - a card taller # than the screen simply ran off the top and the bottom, taking the confirm # and cancel buttons with it. The buttons are anchored to the panel's own # bottom edge, so bringing the edge back on screen brings them back too. # # Only ever shrinks. Growing the card on a big screen would blow the # authored proportions up with it, and the layout inside is tuned, not # fluid. @export var glow_color: Color = Color(0.25, 0.85, 1.0) @export var core_color: Color = Color(1.0, 1.0, 1.0) # Fully opaque: at even 97% the bright neon of whatever sits behind the # panel ghosts through and makes the text harder to read. @export var fill_color: Color = Color(0.02, 0.03, 0.07, 1.0) @export var corner_cut: float = 26.0 @export var bracket_length: float = 46.0 # Breathing room kept between the card and the edge of the screen, so a # fitted panel reads as a card on a backdrop rather than as a full-bleed # page that happens to have a border. @export var screen_margin: float = 24.0 # The size the card was authored at, and the point it is centred on. Read # once, before any fitting has happened - re-reading them later would # measure a previous fit and let the card ratchet smaller on every resize. var design_size: Vector2 = Vector2.ZERO var design_centre: Vector2 = Vector2.ZERO func _ready() -> void: # _fit_to_screen() below rewrites offset_left/right/top/bottom. Under # @tool that runs against the editor viewport, overwriting the authored # layout and dirtying the scene, so the card previews at its authored # size and is only ever fitted at runtime. if Engine.is_editor_hint(): return # Fitting adjusts the four offsets around a fixed centre, which is only # meaningful for a card pinned to a point - both anchor pairs collapsed, # as a centred dialog's are. A panel stretched between different anchors # already follows its parent and is left alone. if not (is_equal_approx(anchor_left, anchor_right) \ and is_equal_approx(anchor_top, anchor_bottom)): return design_size = Vector2(offset_right - offset_left, offset_bottom - offset_top) design_centre = Vector2(offset_left + offset_right, offset_top + offset_bottom) * 0.5 get_viewport().size_changed.connect(_fit_to_screen) _fit_to_screen() func _fit_to_screen() -> void: if design_size == Vector2.ZERO: return # The viewport rect, not the window: with stretch/mode "canvas_items" the # UI is laid out in stretched canvas units, and those are the units these # offsets are in. var available: Vector2 = get_viewport_rect().size - Vector2(screen_margin, screen_margin) * 2.0 var fitted: Vector2 = Vector2( minf(design_size.x, maxf(available.x, 0.0)), minf(design_size.y, maxf(available.y, 0.0))) offset_left = design_centre.x - fitted.x * 0.5 offset_right = design_centre.x + fitted.x * 0.5 offset_top = design_centre.y - fitted.y * 0.5 offset_bottom = design_centre.y + fitted.y * 0.5 queue_redraw() func _draw() -> void: var w: float = size.x var h: float = size.y var c: float = corner_cut var body: PackedVector2Array = PackedVector2Array([ Vector2(c, 0.0), Vector2(w - c, 0.0), Vector2(w, c), Vector2(w, h - c), Vector2(w - c, h), Vector2(c, h), Vector2(0.0, h - c), Vector2(0.0, c), ]) draw_colored_polygon(body, fill_color) NeonDraw.draw_glowing_polygon(self, body, glow_color, 1.0, core_color) # Corner brackets: short doubled strokes just inside each cut corner, # which is what gives it the heads-up-display feel rather than looking # like a plain outlined box. var b: float = bracket_length var inset: float = 10.0 var corners: Array = [ [Vector2(inset, c + inset), Vector2(inset, c + inset + b), Vector2(c + inset, inset), Vector2(c + inset + b, inset)], [Vector2(w - inset, c + inset), Vector2(w - inset, c + inset + b), Vector2(w - c - inset, inset), Vector2(w - c - inset - b, inset)], [Vector2(inset, h - c - inset), Vector2(inset, h - c - inset - b), Vector2(c + inset, h - inset), Vector2(c + inset + b, h - inset)], [Vector2(w - inset, h - c - inset), Vector2(w - inset, h - c - inset - b), Vector2(w - c - inset, h - inset), Vector2(w - c - inset - b, h - inset)], ] for corner in corners: NeonDraw.draw_glowing_line(self, corner[0], corner[1], glow_color, 0.9, 0.3, core_color) NeonDraw.draw_glowing_line(self, corner[2], corner[3], glow_color, 0.9, 0.3, core_color)