Creating a button with dynamic content

Godot Version

Godot 4.3

Question

Hi everyone, I’m trying to create a button that has a VBoxContainer with two labels and one texture rectangle nested inside. The button is not adapting its size to fit the content nested inside it. As you can see in the image, the button area does not wrap all the children’s nodes. I thought about doing a dirty trick of adding a custom minimum size for X and Y, but I’d like the button to adjust to its children’s content. If I set the button to “expand”, it uses way more space than needed.

Thanks for your help
image

Playing around, I created a PanelContainer with a button nested inside. That seemed to work. The button expands the whole PanelContainer, so the whole card seems to be clickable.

image

[node name="ButtonImage" type="PanelContainer"]
offset_right = 192.0
offset_bottom = 136.0
size_flags_horizontal = 0

[node name="ColorRect" type="ColorRect" parent="."]
layout_mode = 2
color = Color(0.7094, 0.356945, 0.488932, 1)

[node name="MarginContainer" type="MarginContainer" parent="."]
layout_mode = 2
theme_override_constants/margin_left = 16
theme_override_constants/margin_top = 16
theme_override_constants/margin_right = 16
theme_override_constants/margin_bottom = 16

[node name="VBoxContainer" type="VBoxContainer" parent="MarginContainer"]
layout_mode = 2

[node name="ButonColorTextureRect" type="TextureRect" parent="MarginContainer/VBoxContainer"]
custom_minimum_size = Vector2(50, 50)
layout_mode = 2
texture = ExtResource("1_cw5fn")
expand_mode = 1
stretch_mode = 5

[node name="ButtonTitleLabel" type="Label" parent="MarginContainer/VBoxContainer"]
layout_mode = 2
text = "hi there"
horizontal_alignment = 1

[node name="ButtonDescriptionLabel" type="Label" parent="MarginContainer/VBoxContainer"]
custom_minimum_size = Vector2(160, 0)
layout_mode = 2
text = "hi there this is a description, but I don't want to make it to long"
horizontal_alignment = 1
autowrap_mode = 3

[node name="Button" type="Button" parent="."]
layout_mode = 2
theme = ExtResource("2_qxtun")```