unity之UGUI屏幕分辨率調整
UI设计原则:
1.常规UI以16:9的宽高比例进行设计,以保证市面大多数机型最好的UI观感;Canvas Scaler设置为Scale With Screen Size(适配屏幕大小),Screen Match Mode默认选择Match Width or Height模式,并设置Match默认值为1(按照高度适配),如下图所示(Canvas Scaler的屬性配置)
2.Loading图以及UI的背景图在设计时尽量让内容处于图像的中部,避免在UI适配时裁减掉关键的的内容细节。
适配方案
针对不同分辨率设备,主要参考设备屏幕的宽高比来进行适配,且UI的背景图单独进行适配。
(1)对于宽高比等于16:9的设备,显示为与设计阶段完全相同的效果。
(2)对于宽高比大于16:9(如MIX2 2:1)的设备,Canvas Scaler设置保持不变,背景图片根据屏幕宽度进行适配,即根据具体比例,裁剪上下少量的背景图。
(3)对于宽高比小于16:9的设备,背景图根据屏幕高度进行适配,即裁剪左右侧少量的部分;根据具体显示情况调节Match Width or Height的Match为合适的值。
3.根據不同的屏幕比例改变缩放基准:
public float standard_width = 1334f; //初始宽度
public float standard_height = 750f; //初始高度
float device_width = 0f; //当前设备宽度
float device_height = 0f; //当前设备高度
float adjustor = 0f; //屏幕矫正比例
void Start()
{
//获取设备宽高
device_width = Screen.width;
device_height = Screen.height;
//计算宽高比例
float standard_aspect = standard_width / standard_height;
float device_aspect = device_width / device_height;
//计算矫正比例
if (device_aspect < standard_aspect)
{
adjustor = standard_aspect / device_aspect;
}
CanvasScaler canvasScalerTemp = transform.GetComponent<CanvasScaler>();
if (adjustor == 0)
{
canvasScalerTemp.matchWidthOrHeight = 1;
}
else
{
canvasScalerTemp.matchWidthOrHeight = 0;
}
}