Scaling viewports in Godot 3

Question

New to Godot/GDScript and I am making a pixel art game.

Low res graphics can easily be scaled up by scaling the viewport, however this affects the scale of all the nodes in the tree. Scaling down the viewport give the desirable crisp edges which cant be gotten from scaling up a sprite node (otherwise the pixel art blurs). The problem comes in when I want to display text or GUI elements over the game.

I want to:

render a tilemap and game sprites on a scaled up node/viewport e.g 120x100 scaled to the window size
Render buttons and text (hud) at a consistent higher resolution on top of the game without scaling

I have tried playing multiple viewports but I just dont have a grasp it yet.

Any help in setting this up would be very appreciated!

hola hola · Accepted Answer · 2018-10-18T00:47:40

I think the setup for this could look like this:

- scene
  - GameViewportContainer
    - Viewport
  - UIViewportContainer
    - Viewport

With the ViewportContainers stretch set to true.

Then in a script on GameViewportContainer:

extends ViewportContainer

var your_custom_size = Vector2(128, 128)

func _ready():
    $Viewport.connect('size_changed', self, '_on_viewport_size_changed')
    change_viewport_size()

func _on_viewport_size_changed():
    change_viewport_size()

func change_viewport_size():
    $Viewport.set_size_override(true, your_custom_size)
    $Viewport.set_size_override_stretch(true)

For further reading checkout:

Hope this helps.

Scaling viewports in Godot 3

1 Answers