Expert blueprint for responsive UI layouts using Container nodes (HBoxContainer, VBoxContainer, GridContainer, MarginContainer, ScrollContainer, HFlowContainer, SubViewportContainer). Covers size flags, anchors, split containers, virtual_list pooling, stretch_shrink previews, and dynamic layouts. Us

Decision Tree: Container type → script Need Prefer MANDATORY script Breakpoint shell / full screen adaptive root Margin + Box containers [responsive layout builder.gd](scripts/responsive layout builder.gd) Fixed columns that change with width GridContainer [responsive grid.gd](scripts/responsive grid.gd) / [responsive inventory grid.gd](scripts/responsive inventory grid.gd) Wrapping chips / tags HFlowContainer [responsive tag cloud.gd](scripts/responsive tag cloud.gd) Thousands of scroll rows Virtual pool (not raw children) [virtual list.gd](scripts/virtual list.gd) Log/chat autoscroll ScrollContainer [terminal autoscroll.gd](scripts/terminal autoscroll.gd) 3D character/item preview in UI SubViewportContainer [viewport 3d preview.gd](scripts/viewport 3d preview.gd) Deep nesting causing layout spikes Anchors/offsets instead [performance anchor layout.gd](scripts/performance anchor layout.gd) Radial/wheel menus Custom Container [custom radial container.gd](scripts/custom radial container.gd) Do NOT Load (by scenario) Scenario Load Do NOT load Inventory / shop grid responsive grid.gd / responsive inventory grid.gd custom radial container.gd , viewport 3d preview.gd Tag cloud / chip wrap responsive tag cloud.gd Grid column scripts, virtual list.gd Thousands of log/chat rows virtual list.gd + terminal autoscroll.gd Inventory/radial/viewport scripts 3D item/character preview viewport 3d preview.gd Radial menu + inventory grid scripts Radial / wheel menu custom radial container.gd Virtual list + tag cloud Deep nesting / layout spikes performance anchor layout.gd Full responsive builder catalog Available Scripts [virtual list.gd](scripts/virtual list.gd) Virtual List Pooling — recycle a small Control pool + spacer height for O(1) ScrollContainer rows. [responsive layout builder.gd](scripts/responsive layout builder.gd) Expert container builder with breakpoint based responsive layouts. [responsive grid.gd](scripts/responsive grid.gd) Auto adjusting GridContainer that changes column count based on available width. [responsive inventory grid.gd](scripts/responsive inventory grid.gd) Expert logic for dynamic Grid columns based on available width and item minimum size. [terminal autoscroll.gd](scripts/terminal autoscroll.gd) Safe ScrollContainer management. Handles the common "one frame delay" bug when adding logs or chat. [viewport 3d preview.gd](scripts/viewport 3d preview.gd) High performance 3D in UI setup. Uses stretch shrink and transparent bg for character previews. [dynamic tab manager.gd](scripts/dynamic tab manager.gd) Pattern for dynamic tab spawning, custom titles, and tab closing logic. [responsive tag cloud.gd](scripts/responsive tag cloud.gd) Wrapping item lists using HFlowContainer , essential for tag clouds and responsive menus. [performance anchor layout.gd](scripts/performance anchor layout.gd) Optimization architecture. Replaces deep container nesting with lightweight Anchor and Offset logic. [custom radial container.gd](scripts/custom radial container.gd) Expert custom container logic implementing a radial/circle layout via NOTIFICATION SORT CHILDREN . [animated container shuffle.gd](scripts/animated container shuffle.gd) Dynamic sibling reordering and animation logic for interactive UI lists. [aspect ratio mini map.gd](scripts/aspect ratio mini map.gd) Enforcing strict aspect ratios (e.g. 1:1, 16:9) across fluid window resizes using AspectRatioContainer . [container size flags pro.gd](scripts/container size flags pro.gd) Advanced sizing logic using SIZE EXPAND FILL and stretch ratio for weighted layouts. NEVER Do in UI Containers NEVER ignore mouse filter properties; strictly set to PASS or IGNORE on overlay containers to prevent them from blocking clicks to underlying buttons. NEVER instantiate thousands of nodes in a ScrollContainer ; strictly use Virtual List Pooling — MANDATORY read [virtual list.gd](scripts/virtual list.gd) ( VScrollBar hook + single spacer child) for O(1) rendering performance. NEVER manually calculate card dimensions for responsive grids; strictly use an AspectRatioContainer to lock proportions (e.g., 2:3 ratio) while allowing parent containers to handle scaling. NEVER manually set child position or size in a Container — Containers override child transforms during queue sort() . Use custom minimum size or size flags instead [1]. NEVER forget size flags for expansion — Default is SIZE SHRINK BEGIN . Children will stay tiny unless you set SIZE EXPAND FILL for responsive containers. NEVER use GridContainer without setting columns — Default is 1, creating a simple vertical list. For responsive wrapping, use HFlowContainer instead [8]. NEVER nest containers too deeply (10+ levels) — Heavy nesting causes layout recalculation spikes. Replace intermediate containers with Anchor Layouts for static padding [16]. NEVER skip separation overrides — Default theme separation is often too tight. Use add theme constant override("separation", value) for professional breathing room. NEVER use ScrollContainer without a minimum size — Without it, the container may collapse to zero or expand infinitely, breaking the scroll mechanism. NEVER scroll to a new child on the same frame it was added — The layout hasn't updated yet. You MUST await get tree().process frame before setting scroll vertical [5]. NEVER scale a SubViewportContainer to change its size — This distorts the rendered contents. Adjust margins or use stretch and stretch shrink properties instead [2]. NEVER leave mouse filter on default for layered Viewports — Input events might not reach children. Use MOUSE FILTER PASS or STOP to ensure events drill down [6]. NEVER use GridContainer for responsive wrapping — Use HFlowContainer if you want items to wrap based on width. GridContainer enforces a strict column count [7]. NEVER animate position directly inside a container — Use Tween on custom minimum size to smoothly "push" siblings during transitions [1]. Expert Layout Patterns 1. Split Screen Container (Dynamic) Standard pattern for local multiplayer or comparisons using HSplitContainer . 2. Virtual List ScrollContainer (Pooling) High performance list for thousands of items. MANDATORY : implement via [virtual list.gd](scripts/virtual list.gd) ( setup pool + set data ) — do not paste a one off scroll recycler inline. 3. Aspect Ratio Locked Cards Responsive cards that maintain proportions (e.g., 2:3) in any grid or flow container. Size flag recipes: MANDATORY [container size flags pro.gd](scripts/container size flags pro.gd) — do not paste beginner SIZE EXPAND FILL tutorials inline. Deep recipes (on demand) LLM ignorance rule: if a general agent would not know it before reading, it lives here or in scripts/ — never delete, only move. Topic Reference Anchors, flags, separation [container layout recipes.md](references/container layout recipes.md) Reference Progressive disclosure: open Official Documentation links only when researching a specific API; load Related Skills when routing to a peer domain — do not preload the whole lattice. Official Documentation [Using Containers](https://docs.godotengine.org/en/stable/tutorials/ui/gui containers.html) — Canonical guide for box/grid/flow/split containers, size flags, and when Containers override child transforms. [Size and anchors](https://docs.godotengine.org/en/stable/tutorials/ui/size and anchors.html) — Anchor presets and offsets for responsive Control placement when you intentionally skip deep Container nesting. [Control node gallery](https://docs.godotengine.org/en/stable/tutorials/ui/control node gallery.html) — Visual catalog of Control/Container types so agents pick HFlow vs Grid vs Split correctly. [Custom GUI controls](https://docs.godotengine.org/en/stable/tutorials/ui/custom gui controls.html) — NOTIFICATION SORT CHILDREN and fit child in rect patterns required for custom radial/layouts. [GUI navigation](https://docs.godotengine.org/en/stable/tutorials/ui/gui navigation.html) — Focus neighbors and keyboard/gamepad traversal across container built menus. [Multiple resolutions](https://docs.godotengine.org/en/stable/tutorials/rendering/multiple resolutions.html) — Stretch modes and content scale that interact with container driven responsive UI. [Control](https://docs.godotengine.org/en/stable/classes/class control.html) — size flags , custom minimum size, mouse filter, and anchors APIs every layout script uses. [Container](https://docs.godotengine.org/en/stable/classes/class container.html) — Base sort lifecycle (queue sort / SORT CHILDREN) that forbids manual child position/size. [ScrollContainer](https://docs.godotengine.org/en/stable/classes/class scrollcontainer.html) — Scroll bars, minimum size pitfalls, and post frame scroll vertical updates for log/chat UIs. [HFlowContainer](https://docs.godotengine.org/en/stable/classes/class hflowcontainer.html) — Width based wrapping for tag clouds and chip lists (prefer over fixed column GridContainer). [AspectRatioContainer](https://docs.godotengine.org/en/stable/classes/class aspectratiocontainer.html) — Lock card/minimap proportions under fluid parent sizes. [SubViewportContainer](https://docs.godotengine.org/en/stable/classes/class subviewportcontainer.html) — stretch / stretch shrink for 3D in UI previews without scaling distortion. Related Skills Prerequisites [godot project foundations](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot project foundations/SKILL.md) — Scene tree ownership, Control roots, and project layout conventions every responsive menu assumes before wiring containers. [godot gdscript mastery](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot gdscript mastery/SKILL.md) — Typed Control APIs, @onready , and safe child rebuild loops used when building grids/tabs at runtime. [godot signal architecture](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot signal architecture/SKILL.md) — Resize, tab changed, and inventory refresh signals should flow signal up / call down so layout scripts never own game state. Complements [godot ui theming](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot ui theming/SKILL.md) — Theme constants ( separation , margins) and type variations style container chrome without hardcoding colors in layout code. [godot ui rich text](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot ui rich text/SKILL.md) — RichTextLabel minimum sizes and BBCode content drive ScrollContainer height; pair after the layout shell exists. [godot tweening](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot tweening/SKILL.md) — Animate custom minimum size / reorder feedback instead of tweening position inside Containers. [godot input handling](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot input handling/SKILL.md) — Focus, mouse filter, and action maps for interactive lists/tabs built from Containers. [godot adapt desktop to mobile](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot adapt desktop to mobile/SKILL.md) — Breakpoint driven column counts and safe area margins compose with responsive Grid/HFlow builders. [godot inventory system](https://github.com/thedivergentai/gd agentic skills/blob/main/skills/godot inventory system/SKILL.md) — Inventory grids consume responsive column logic; containers present slots, inventory owns item truth. [godot performance optimization](https://github.com/thedivergentai/gd agentic skills/blob/main/

godot-ui-containers