[Solved] Screen Size Adjustment

Good day! So I did my Gdevelop on my computer and when I open it on my phone the right UI is pushed to the left side. I understand that this is due to the properties “Adjust screensize…” etc. But is this how it will look like if I exported the playable game? How do I make the whole with UI full size fit to my screen?

For UI elements you should change their position to camera borders
For example you should Center position of left stick to CameraBorderLeft()+ SOME NUMBER for example 20 pixels

Where change Center X position of right stick to CameraBorderRight()- SOME NUMBER

On X axis + means more to the right while - means more to the left
On Y axis + means more to the bottom while - means more to the top

There is CameraBorder Left Right Bottom Top ()

Thank youuu ZeroX4! Question, just to clarfiy, will the UI adjust to different screen sizes?

1 Like

I found a way to adjust it to the side, I just need to use the Anchor Behavior for each UI. Thank you so much for your suggestion.

IF you change position of your objects based on borders + some number values then they will always stay the same way
Look below

I did not change manually position of red button in upper left and blue button in upper right
I only changed window size
They adjusted position on their own cause i use this

Where their size also could be adjusted automatically
But for that you would need to set their size to some variable and increase it based on camera height or width or both
Where i say better approach A LOT BETTER is to allow player to manually adjust their size if any adjustment is needed
But in most cases scaling UI element should NOT be done

Anchor behavior is perfectly fine
Yet i never suggest it
Cause it is a lot easier for player to adjust by numbers like go from CameraBordrLeft()+20 to CameraBordrLeft()+50
Rather than adjusting position of object in scene editor
At least that is my personal opinion
I am not saying you can’t use anchor or that anchor is bad
If you have better experience with anchor behavior then go with it

And just so you can test it out

Open it in browser and change your browser size

And you will see buttons stay in same distance to screen borders
(i was trying to make it also work for portrait mode on mobile but i abandon it so if you make width too small it will break but other than that if you make height smaller buttons will stick to borders)

Thank you so much for this ZeroX4! I will try this approach if my Anchor goes haywire hahah I really appreciate your help.

1 Like