Create in-game resizable UI windows

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Arecher

I have recently been diving into Godot’s UI. I have found nearly everything I would need supported through nodes, apart from one thing:

I want to create a UI panel, in game, that allows the player to rescale it horizontally or vertically, to their desired height/width.

Basically as any Windows application can be resized, or in the way that Hsplit/Vsplit work, but then at the edges of a window. Someone asked this before a few months ago, and had some great visual examples: Create Resizable Window - Godot Q&A

Is something like this support natively through Godot, or would I have to make this myself (through collision boxes & Gscript). And if so, does anyone have any suggestions on how to tackle this?

Thanks in advance!

:bust_in_silhouette: Reply From: Zylann

The Godot editor itself is made with the same nodes you can use in a game. Some of the windows in here are resizeable, so it’s definitely possible to make a resizeable panel.

The built-in way is to use the WindowDialog class, which has a resizeable flag out of the box. If the title bar annoys you, you can re-style it by changing the styleboxes in the inspector.

I cannot believe that I missed that one. Thanks a bunch!
I’ll go experiment with it, and see if I can modify it to my needs!

Arecher | 2019-09-11 13:53

if you have problem with that X button for closing that remains after removing bar - I used this :


remove_child(get_children()[0]) 

to ged rid of it.

Rafiz | 2020-03-06 01:56

Rafiz, don’t do this. It will make the node leak and it’s not guaranteed to always be the first child in future versions.

To turn it off, you could do this instead:

get_close_button().hide()

https://docs.godotengine.org/en/stable/classes/class_windowdialog.html#class-windowdialog-method-get-close-button

Zylann | 2020-03-06 19:12