How do I resize GUI elements based on viewport size?

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

On my android project, I set the project resolution to my phone resolution. My GUI elements are well anchored and are sized accordingly.
But when I share the app to a phone with lower resolution, the buttons and other GUI elements are anchored, but do not resize accordingly.
How do I resize them with the viewport?

:bust_in_silhouette: Reply From: db0

I’m guessing you have anchored them correctly but for the size you should be using the viewport_size as a multiplier instead of hardcoding it.

let’s say you development viewport size 100x200. In this size,your control has a size of 20x20. You don’t put 20x20 in your control size, but rather you set it via code during _ready().

rect_size.x = get_viewport().size.x / 5

rect_size.y = get_viewport().size.y / 10

Now when you resize your viewport to 200x400, your control will automatically resize to 40x40 but stay anchored at the right place.

Wow! It works beautifully.
Thank you very much

stan.wick.52 | 2020-11-05 14:41

1 Like