Unity 之实现背景图动态适配不同分辨率

作者：陈言必行

2023-04-27
辽宁
本文字数：2006 字
阅读完需：约 7 分钟

@[TOC](Unity 之实现背景图动态适配不同分辨率)

一，问题背景

如何动态为一张背景图实现不同分辨率的适配？

在不同分辨率的设备上，背景图可能会出现拉伸、压缩或失真等问题，因此需要对背景图进行适当的缩放和调整，以确保在不同分辨率下都能够保持良好的外观效果。

二，解决思路

要使用该代码示例，您需要按照以下步骤操作：

在 Unity 编辑器中，创建一个新的空对象，并将其命名为 BackgroundScaler。
将 BackgroundScaler.cs 脚本文件添加到 BackgroundScaler 对象中。
在工程文件夹中创建一个名为 Backgrounds 的子文件夹，并将背景图添加到该文件夹中。
在 BackgroundScaler.cs 脚本文件中，将 backgroundSprite 变量设置为您添加的背景图的 Sprite。
将 BackgroundScaler 对象添加到场景中。
运行场景，并在不同分辨率的设备上测试背景图的适配效果。

三，注意事项

在使用该代码示例时，请注意以下几点：

背景图应该具有适当的纵横比，以确保在不同分辨率下都能够保持良好的外观效果。
在测试适配效果时，请使用不同分辨率的设备进行测试，并观察背景图是否出现拉伸、压缩或失真等问题。
如果您的背景图太大或太小，可能会影响适配效果。请尝试使用适当的图像编辑工具对背景图进行缩放或裁剪，以确保其大小适中。

四，代码分享

通过使用该代码示例，您可以动态为一张背景图实现不同分辨率的适配，并确保在不同分辨率下都能够保持良好的外观效果。在实际开发中，您可以根据具体情况对代码进行修改和优化，以满足需求。

具体代码如下：

using UnityEngine;using UnityEngine.UI;
public class BackgroundScaler : MonoBehaviour{    public Sprite backgroundSprite; // 存储背景图
    private Image backgroundImage;
    void Awake()    {        backgroundImage = GetComponent<Image>();
        // 获取当前设备的分辨率        float screenHeight = Screen.height;        float screenWidth = Screen.width;
        // 计算目标背景图的宽高比        float targetAspect = screenWidth / screenHeight;
        // 获取背景图的宽高比        float imageAspect = backgroundSprite.rect.width / backgroundSprite.rect.height;
        // 如果目标宽高比小于背景图宽高比，则以宽度为基准进行缩放        if (targetAspect < imageAspect)        {            float scaleFactor = backgroundSprite.rect.width / screenWidth;            float scaledHeight = backgroundSprite.rect.height / scaleFactor;
            // 设置背景图的大小和位置            backgroundImage.rectTransform.sizeDelta = new Vector2(screenWidth, scaledHeight);            backgroundImage.rectTransform.position = Vector3.zero;        }        // 如果目标宽高比大于或等于背景图宽高比，则以高度为基准进行缩放        else        {            float scaleFactor = backgroundSprite.rect.height / screenHeight;            float scaledWidth = backgroundSprite.rect.width / scaleFactor;
            // 设置背景图的大小和位置            backgroundImage.rectTransform.sizeDelta = new Vector2(scaledWidth, screenHeight);            backgroundImage.rectTransform.position = Vector3.zero;//new Vector2(screenWidth / 2, screenHeight / 2);        }
        // 设置背景图的 sprite        backgroundImage.sprite = backgroundSprite;    }}

复制代码

五，实战应用

根据画布大小和屏幕比例来决定背景缩放比例：

using UnityEngine;using UnityEngine.UI;
public class BackgroundScaler : MonoBehaviour{    public Canvas BackgroundCanvas;
    private Image backgroundImage;
    private void Start()    {        if (BackgroundCanvas != null)        {            backgroundImage = GetComponent<Image>();            UpdateBackgroundSize();        }    }
    private void UpdateBackgroundSize()    {        RectTransform rt = backgroundImage.rectTransform;        float screenWidth = BackgroundCanvas.GetComponent<RectTransform>().rect.width; //Screen.width;        float screenHeight = BackgroundCanvas.GetComponent<RectTransform>().rect.height; //Screen.height;        float screenRatio = screenWidth / screenHeight;        float bgRatio = rt.rect.width / rt.rect.height;
        if (screenRatio > bgRatio)        {            rt.sizeDelta = new Vector2(screenWidth, screenWidth / bgRatio);        }        else        {            rt.sizeDelta = new Vector2(screenHeight * bgRatio, screenHeight);        }
        rt.anchoredPosition = new Vector2(0, 0);    }}

复制代码

发布于: 刚刚阅读数: 3

原文链接:【http://xie.infoq.cn/article/91576a17d418ead83a1d8b510】。未经作者许可，禁止转载。

陈言必行

关注

公号：开发同学留步 2019-03-12 加入

我是一个从事Unity游戏开发攻城狮，InfoQ&阿里云签约博主，CSDN博客专家，U3D论坛版主，6年开发经验，助你日常不加班。⽂章皆为从零到⼀的⼊⻔级教程，也有很多⼯作中遇到的问题解析。

发布

暂无评论

创作场景

Unity 之 实现背景图动态适配不同分辨率