Need Opinions/Ideas/Solutions for Screen Resolution Dilemma

Unity Engine
,
1

Hello,

I am making a mobile game on Android. The nature of the game requires a rectangle as a border for the screen. I need it because it is a platformer and the player has to rotate their device 90 degrees (ambitious, i know) at certain checkpoints. I have pretty much everything working well and am now stuck when it comes to different screen resolutions. I spent some money on an asset called Camera Fit and it appeared to help but i have never made it this far in production before (my first game of course).

Situation: I made my game in 16:9 Landscape the whole time. Here is what it looks like:

6472298--726563--upload_2020-10-29_20-14-40.png
6472298--726563--upload_2020-10-29_20-14-40.png927×470 116 KB

UI and everything looks and fits well on my old phone (was a 16:9 resolution screen).

I recently got a new phone and it is a 18:9 screen. Here is what it looks like without changing anything in the inspector after changing the resolution display:

6472298--726566--upload_2020-10-29_20-16-22.png
6472298--726566--upload_2020-10-29_20-16-22.png927×467 119 KB

I have an easy solution for the left and right sides of the screen, so im not worried about that. I am worried about the UI and buttons.
Here are my canvas settings:
6472298--726569--upload_2020-10-29_20-18-14.png

I have tried messing around with the Camera, the Camera Fit script (quite simple functionality) and the Canvas. I cannot seem to figure out the UI.

What I want: I need some ideas, solutions, opinions, etc. on how to get these buttons in the right spot of the “Steel Frame” for all resolutions. Let me know if im an idiot and doing something totally wrong, I am just trying to learn and this whole resolution thing is starting to really get to me.

Thanks for any and all help!

2

Firstly, I would test using actual pixel resolutions, not the 16:9 setting which is only something like 860x480 in that window.

You could change the Canvas Scaler to a 16:9 resolution. You are basically saying this UI is suited for 800x600 (4:3).

You could also change the slider to Match height (1), then extend the borders sideways.

Scale With Screen Size basically means your UI will zoom in/out, but otherwise look the same, unless you are using percentage anchors. The downside is it will look very large at larger resolutions that are higher than your Reference Resolution, and look smaller (and maybe unreadable) at smaller resolutions.

Constant Pixel Size will have large spacing differences for every res, but will not zoom in/out. The downside is it will look small at high resolutions.

1 Like