Canvas scaling UI with Pixel Perfect camera

Unity Engine
,
1

Hello,
I have a bit of a problem with UI scaling in my pixel art game.

I have a canvas with the UI elements set to Screen Space - Camera, Canvas scaling with screen size and a UI_Camera showing only the UI layer.

UI_Camera:

Canvas:

Now this works when the game is running in 640x360, 1920x1080 or any other resolution that does not require any frame cropping.

It should look like this:

But when I play the game for example at 800x600 the pixel perfect camera correctly crops the game view to 640x360 but the UI is scaled to fit 800x600 and smushed down to 640x360.

This is how the 800x600 display looks with the Pixel Perfect camera turned off:

And this happens when the Pixel Perfect camera is turned on:

And I do want the UI and all game elements to appear inside those black bars but not with the UI slammed like that. The scaling works correctly for 640x360 when I play the game in 640x360 so I don’t know how to make the UI scale properly in any resolution that requires frame cropping.

Any ideas how to work around it?
Thank you.

2

Bump, anyone please?

3

Ok, so I did some more digging and happened upon this thread. The custom Canvas Scaler there did the trick for me, UI elements are now scaled correctly with the borders taken into consideration.

1763×924 35.5 KB

I also started using URP so I had to use its Pixel Perfect Camera component.

4

unity is a mess, having problems too with pixel perfect and canvas :confused:

5

I mean having a UI_Camera showing just the UI elements and the custom Canvas Scaler linked above solved my issue.

3 Likes