Keep game world aspect ratio while rendering UI using the whole window

Question

I want to keep the aspect ratio of the game world (2d) for multiple reasons (most important one being related to where the player can and cannot go) but I also want to use the excess space (what whould be black bars if the project was configured to actually keep the aspect ratio) between the world and the window edge for ui rendering.

My current idea for this is rendering the world in a Viewport then using BoxContainers for automatic backgrounds and just rendering the UI above everything else here, repositioning and rotating it as convenient.

The problem with this approach is that the Viewport doesn't scale it's resolution, so it ends up being pixelated on higher window sizes... anyone has a better way to implement this or knows how to handle dynamically changing the Viewport resolution without zooming out the camera?

Answer 1

I had to do this too, and didn't find any way to mark viewports explicitly as being 2D like in the ProjectSettings.

I had to dig in the engine code (https://github.com/godotengine/godot/blob/b38ac3f09fb5386ba8236db2b3efcf654a9e27d8/scene/main/scene_tree.cpp#L1314) to figure out what those settings do, and remake them in GDScript. So, for having a Viewport act as 2D, check for changes in the main viewport size, and then apply those settings to it:

onready var n_viewport : Viewport = $ViewportContainer/MyViewport
onready var viewport_orig_size := n_viewport.size

func _ready():
    get_viewport().connect("size_changed", self, "_on_vp_size_changed")

func _on_vp_size_changed() -> void:
    print("New size: ", get_viewport().size)
    n_viewport.size = get_viewport().size
    n_viewport.size_override_stretch = true
    n_viewport.set_size_override(true, viewport_orig_size)