How to set a Viewport stretch mode to 2d/expand whilst the root's is disabled via ProjectSettings

CcamelCase · Feb 15, 2022

What am I trying to achieve?

I'm trying to make a high-res UI for a game with pixel art, hence why I need it! To scale things in the world, I have a script that sets the zoom of the camera based on the ratio between the screen size and the "native" resolution of the game (then I round the value), so I have an integer scaling (I have to disable the stretch mode on the Project Settings): https://i.imgur.com/q8KH9tm.gif

If I just scale the UI (as I do in my game with pixel art UI), its content, especially the text, won't look good. For that, I need 2d/expand stretch mode, which works perfectly. The issue here is that if I set the stretch mode to 2d/expand in the ProjectSettings, the pixel art will get ugly: https://i.imgur.com/cN2OhTe.gif

So basically, I need to keep the main stretch mode disabled whilst setting it to 2d/expand in my custom viewport. Is it possible?

Calinou · Feb 15, 2022

The issue here is that if I set the stretch mode to 2d/expand in the ProjectSettings, the pixel art will get ugly:

You can likely change the Camera2D zoom automatically to be multiplied (or divided) by the scale factor automatically computed by the engine. This will ensure pixel art is displayed at its original size.

The automatic 2D scale formula works as follows (pseudocode):

scale_factor = min(actual_window_size.x / float(base_window_size.x), actual_window_size.y / float(base_window_size.y))

actual_window_size is the current size of the window as resized by the user. base_window_size is the window size defined in the Project Settings.

cybereality · Feb 15, 2022

You can do this with 2 viewports. One for the game and one for the UI. I also got this working with my plug-in Godot Super Scaling, but I don't support integer scaling. However, you can look at the code and modify it to your needs. https://github.com/cybereality/godot-super-scaling

CcamelCase · Apr 28, 2022

So I tried to render the viewport to a TextureRect (just setting the viewport's texture as its tex) and I get the same behaviour as the 'viewport' one in the ProjectSettings. I assume I'm close to it?

My tree: https://i.imgur.com/IzRm4Gf.png

The result: https://i.imgur.com/qfBh1VA.png

I tried resizing the viewport in the renderer's _process, it keeps things pretty but it doesn't scale when I resize the window (again, in '2d' mode, it increases the size of things w/o making them look stretched). I tried to find out what how cybereality's superScaling did in its code but unfortunately couldn't (I thought resizing the viewport would do it but nah).