• Godot HelpGUI
  • Adding background to VBoxContainer that shrinks / expands with its contents

First post here, so apologies if I’m asking in the wrong place or phrasing / formatting this incorrectly.

I have a bit of UI that appears at the bottom of the screen, which shows a bunch of option buttons the player can click on. There may be just a couple of options, or there may be many.

My set up is like this:

I'd like to have a background the same size as OptionsDisplay, but I'd like it to shrink / expand as needed, depending on the number (and size) of OptionButtons.

I can probably figure out how to do this using scripting, but it feels like there should be a way of doing this in the editor, using Containers' natural functionality. However, I can't figure out how. If I put a Panel (or ColorRect, or something similar) inside the VBoxContainer, it's just going to act like any other child of the VBoxContainer. If I put the Panel in the ScrollContainer (or any higher in the hierarchy), it won't shrink when the number of options is low.

Is there something obvious I'm missing? Or should I just bite the bullet and script it myself?

  • I found a solution:

    The ScrollContainer needed moving higher up the hierarchy (which means it scrolls some of the margins as well, which it didn't before - but I think that's probably better).
    But adding in the two selected Containers was where the magic happened.

    Putting a PanelContainer around the MarginContainer allowed for a background colour to be added (as a StyleBoxFlat, under Theme Overrides).
    And putting the PanelContainer inside a VBoxContainer allowed for the new VBoxContainer to force the PanelContainer to shrink down to its necessary size.

I found a solution:

The ScrollContainer needed moving higher up the hierarchy (which means it scrolls some of the margins as well, which it didn't before - but I think that's probably better).
But adding in the two selected Containers was where the magic happened.

Putting a PanelContainer around the MarginContainer allowed for a background colour to be added (as a StyleBoxFlat, under Theme Overrides).
And putting the PanelContainer inside a VBoxContainer allowed for the new VBoxContainer to force the PanelContainer to shrink down to its necessary size.