Unity3D UGUI自适应
程序员文章站
2022-07-12 23:38:39
...
分享一种自己使用的UGUI自适应的方法,可能不同于大部分人使用的方式(其实大部分人用什么方式自适应我也不是很了解)
添加一个Image、一个Button未自适应的情况(上为1920*1080 下为4:3)
我所使用的自适应方式需要3步:
1.更改Canvas上Canvas Scaler的设置 将UI Scale Mode 从Constant Pixel Size 选项改为 Scale With Screen Size,并将Reference Resolution中的X,Y改为所希望的(所设的)分辨率(此处我设为1920*1080)
2.在Canvas 上挂一个脚本AutoAdaptation作用是根据实际设备的分辨率自动更改Canvas Scaler 中 Match的值
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class AutoAdaptation : MonoBehaviour
{
[SerializeField]
float standard_width = 1080; //初始宽度
[SerializeField]
float standard_height = 1920; //初始高度
private void Awake()
{
float device_width = 0f; //当前设备宽度
float device_height = 0f; //当前设备高度
float adjustor = 0f; //屏幕矫正比例
//获取设备宽高
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;
}
}
}
3.一个扩展编辑器脚本SetAnchorInEditor,放在Editor文件夹下(最好),使用时先选中要设置Anchor的UI物体(支持一次选中多个,但不能有层级关系[比如同时选中父物体和子物体]),先手动将Anchor设为中心middle-center,之后在Tools选项栏中点击SetAnchor即可(点击前要确保选中的所有物体没有层级关系,并且原Anchor都在中心点)using System;
using System.Collections.Generic;
using UnityEngine;
using UnityEditor;
public class SetAnchorInEditor:MonoBehaviour
{
[MenuItem("Tools/SetAnchor")]
public static void SetAnchor()
{
GameObject[] targets=Selection.gameObjects;
foreach (GameObject t in targets)
{
//将要设置Anchor的物体的父物体
RectTransform parent = Selection.activeGameObject.transform.parent.GetComponent<RectTransform>();
//父物体的像素大小
Vector2 parentSize = new Vector2(parent.rect.size.x, parent.rect.size.y);
//将要设置Anchor的物体
RectTransform target = t.GetComponent<RectTransform>();
if (target == null)
{
Debug.LogError("选中目标不是UI物体");
return;
}
//当前Anchor下的相对位置
Vector2 targetPosition=new Vector2(target.anchoredPosition.x,target.anchoredPosition.y);
Vector2 targetSize=new Vector2(target.rect.size.x,target.rect.size.y);
float xMin = (targetPosition.x + parentSize.x / 2 - targetSize.x / 2) / parentSize.x;
float xMax = (targetPosition.x + parentSize.x / 2 + targetSize.x / 2) / parentSize.x;
float yMin = (targetPosition.y + parentSize.y / 2 - targetSize.y / 2) / parentSize.y;
float yMax = (targetPosition.y + parentSize.y / 2 + targetSize.y / 2) / parentSize.y;
target.anchorMin = new Vector2(xMin,yMin);
target.anchorMax = new Vector2(xMax,yMax);
target.offsetMax = Vector2.zero;
target.offsetMin = Vector2.zero;
}
}
}
与大部分自适应方式不同的地方在第三步的设置Anchor上,UGUI的Anchor十分强大,只凭借Anchor其实就可以做好大部分的自适应,不过Unity只提供了固定位置的快速设置Anchor,没有根据当前位置自动将Anchor设定在四周的快捷方式,因此写了一个辅助脚本来进行快速设置。
设置好自适应后的效果(上为1920*1080 下为4:3)
上一篇: 杂
下一篇: (转)Jquery .each()循环
推荐阅读
-
js控制iframe的高度/宽度让其自适应内容_javascript技巧
-
css多栏自适应布局_html/css_WEB-ITnose
-
暴风魔镜SDK在Unity3D 5.6中的简单应用
-
暴风魔镜SDK在Unity3D 5.6中的简单应用
-
当iframe嵌入子网页时,如何使用js交互。比如父窗口iframe自适应子网页高度
-
css实现左(右)侧固定宽度,右(左)侧宽度自适应 ---清除浮动
-
移动端自适应布局的高效方法,欢迎批评或指正_html/css_WEB-ITnose
-
css实现六种自适应两栏布局方式
-
【Unity3d】C#使用XmlDocument读写xml含冒号的节点(含命名空间)
-
CSS自适应铺满浏览器全屏布局