OptionButton dropdown appears behind other control nodes

Question

I'm getting used to Godot 4.0, and I ran into an issue where the dropdown menu from OptionButton draws behind all the other control nodes (or, at the very least, those further down the scene tree).

I changed its z-index in the inspector to be higher than the other control nodes, but this didn't help. I've also rearranged the scene tree twice: first, I rearranged it so that everything was in HBox and VBox containers instead of the GridContainer, and that didn't help; and second, to place the HBoxContainer that the OptionButton node is in inside of a CanvasLayer, and this didn't change anything either.

I have suspicions about what's going on (and a really sloppy way of fixing it in mind, involving importing this scene from Godot 3.5 which does work normally). But, I'm wondering if anyone has suggestions. Thanks!

Answer 1

This seems to be caused by the Window having set always_on_top to true, making it appear on top of every other window, including the PopupMenu from the OptionButton.

Thus your first solution is to not use always_on_top.

---

If you need always_on_top, we could hack it from script by getting the hidden PopupMenu and setting its always_on_top to match the Window:

extends OptionButton


func _ready() -> void:
    get_popup().always_on_top = get_window().always_on_top

---

Looking further into it took me to this issue: always_on_top breaks non-embedded popups, it seems to be related, although I'm getting the unexpected behavior even with embed_subwindows enabled in project settings.