Inventory grid cells not scaling properly for different resolutions

jasong

Hey guys,

I'm trying to get my inventory to display properly across different resolutions, but am running into a bit of a snag getting the grid cells for each item to display correctly. The Unity UI Grid Layout doesn't seem to scale at all across different displays even with the Canvas Scaler element. I did find this script (http://www.justapixel.co.uk/ugui-auto-scaling-grid-layout-code/) which gets me a lot closer. However, there's still a bit of skewing going on with the images on a couple of resolutions. Has anyone else run into this issue and were able to figure out a solution?

Example below of bad skewing at 5:4 aspect ratio:


Example of proper display at 16:9 aspect ratio:


Thanks!

Alverik

Umm, I've been taking a look at this post for a while, but this is a tough one. It might be worth it to check the Unity forums for more ideas on how to keep Unity UI's aspect ratio as correct as possible. Cause this kind of thing is usually a battle...

jasong

Thanks for looking into it, Alverik! I figured there's no easy solution here. I did manage to come across the Steam hardware survey and found this might not be as big of an issue since most people play at a 16:9 or 16:10 aspect ratio (http://store.steampowered.com/hwsurvey/). For the others like 5:4 and 3:2 it seems those are more common on tablets and mobile devices so it might be better to plan on resizing the inventory and do a separate build just for those.

ChrisIceBox

If you're using Unity UI, then it'll be down to Unity's own UI components to handle it - AC has it's own corrective functions for handling different aspect ratios, but only for Menus with Source set to Adventure Creator.

jasong

Chris, are AC menu's corrective functions able to resize and reposition menu elements in-game like Unity's UI or can they only be adjusted before building the game with the "Position" and "Size" sliders in the menu elements properties? I was playing around with this some more to see if AC has a way to correct the UI components when switching from a 16:9 to 16:10 aspect ratio, but all the options I've tried seem to squash the UI elements.

ChrisIceBox

There is a little positioning adjustment to ensure UI Menus do not go off screen, but no size adjustments.  What version of AC?  The rescaling code was rewritten a short few releases ago.

In general, the aspect ratio set in AC's Settings Manager would need to be read by your UI elements through a custom script if you wanted to adjust them according to it.  You can get an API reference to it by right-clicking the field.

jasong

Thanks, Chris. I'm on version 1.56, haven't upgrade to a letter version (a-g) yet. Does this one have the latest rescaling code?

ChrisIceBox

It was mostly in v1.55, but an additional fix on menu positioning was made in v1.56b.

jasong

I found a couple of solutions! I had the Canvas Scaler component Screen Match Mode set to Match Width or Height and set the Match for 0.5 so it would scale in both directions when changing resolutions. When changing Match to 0 so the Width only gets changed then the inventory items scale without skewing at all resolutions!

In addition, just using the Force Aspect Ratio option in the Settings menu and setting it to 1.7778 for 16:9  is a workaround for making the game display correctly at any resolution. Letterboxing is used in this solution and seems to work best for default AC menus as Unity UI menus can get hidden behind the letterbox if the Rect Transforms are set to anything other than being centered.