Unity UI Pixel Perfect UI and Resolutions/Aspect Ratios

Hi,

I'm currently developing a 3D game that requires a pixel perfect UI (pixel art UI Icons, 16x16) and I'm having massive problems getting the UI pixel perfect on different resolutions. Now I know that 2D pixel perfect assets require some work arounds and tried to apply these solutions to the UI but none of them seems to be working correctly.

I've set the filter to point, removed the texture compression and tried different pixel perfect solutions, like using a pixel perfect camera script or the renderer texture solution. I also tried to use 32x32 versions of the icons with active filtering, which more or less eliminates the pixel perfect problem but doesn't look right with the general design of the UI.

I'm either failing to set up the provided solutions correctly, totally misunderstood the way UI scaling works or I'm doing something else wrong. Have anybody encountered a similar issue or knows a solution for it? Is it even possible to provide a pixel perfect interface on multiple resolutions/aspect ratios without using the "constant pixel size"?

 

Rubber duck. So shortly after I've made this post I've found the solution (atleast, I hope so).

I ended up using the constant pixel size settings and wrote two scripts. One to adjust the scale factor of the canvas scaler to a certain range of resolutions and one to adjust the size of the grid layout group items.

I don't know if this works for every type of interface but so far it works for me.

Here's the script that adjusts the scale factor:

Code (CSharp):

1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4. using UnityEngine.UI;
5.  
6. [System.Serializable]
7. public class canvasSizeSettings
8. {
9.     public float scaleFactor;
10.     public Vector2 minResolution;
11.     public Vector2 maxResolution;
12. }
13.  
14. public class cs_UIScaler : MonoBehaviour
15. {
16.     public CanvasScaler scaler;
17.  
18.     [Header("Width x Height")]
19.     public canvasSizeSettings[] scalerSettings;
20.  
21.     void Start()
22.     {
23.         scaler = GetComponent<CanvasScaler>();
24.     }
25.  
26.     void OnEnable ()
27.     {
28.         Debug.Log(Camera.main.pixelWidth + "x" + Camera.main.pixelHeight);
29.         foreach (canvasSizeSettings settings in scalerSettings)
30.         {
31.             if (settings.scaleFactor > 0 && settings.maxResolution.x > 0 && settings.maxResolution.y > 0)
32.             {
33.                 if (Camera.main.pixelWidth >= settings.minResolution.x && Camera.main.pixelHeight >= settings.minResolution.y && Camera.main.pixelWidth <= settings.maxResolution.x && Camera.main.pixelHeight <= settings.maxResolution.y)
34.                 {
35.                     scaler.scaleFactor = settings.scaleFactor;
36.                     Debug.Log("Found Resolution: " + settings.minResolution);
37.                     break;
38.                 }
39.             }
40.         }
41.     }
42. }
43.