Developing for Retina and HiDpi

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Jay Kyburz
:warning: Old Version Published before Godot 3 was released.

My main machine has a standard 1080p screen, but I want my game to look great on my iPad and SurfacePro. I was wondering the best way to develop for both kinds of devices. Should I…

a) Develop my UI in the editor at 2040x1536, use the hidpi skin, and scale down my root UI node for smaller resolutions or…

b) Develop my UI at 1024x768 and scale up somehow… (as is done in web development)

I assume developing a the high res will be best, but interested in peoples thoughts.

:bust_in_silhouette: Reply From: DimitriyPS

In my project, I implemented in the settings switching the screen resolution + created 3 themes of different scale. Switching themes tied to the switch screen resolutions. Thus, I support three categories of screens:

  • HD
  • FullHD
  • UltraHD

On ver 3+, using SVG may be enough for this.

eons | 2017-11-10 09:21

It’s very interesting. SVG can be used in themes? Is there a tutorial?

DimitriyPS | 2017-11-10 15:51

On 3, svg can be imported as image resource (like any other valid resource), vector are converted to raster but should solve scaling issues on UI in particular.

This is the pr SVG support by djrm · Pull Request #10433 · godotengine/godot · GitHub

And no tutorial, not even for 2 so for 3 will take a while to have one.

eons | 2017-11-10 23:50

:bust_in_silhouette: Reply From: Jay Kyburz

I thought I would come back and make some notes about how I am planning to work after a couple of days of research and playing around. I’m still learning the engine.

I was hoping that scaling a font down would not look too bad, but It was too bury, and I really wanted the game to look its best at 1080p - given that’s how most users would see the game.

Instead I have written some scripts that allow me to scale fonts by changing their pos, size and font size.

I also decided I would not try and use components with scroll bars and other fancy things that need skins. I should be able to stick with ColorFrames, Text and, Sprites.

I’m quite happy with how its all working, but If you are interested in seeing some results feel free to get in touch and let me know.