C# Unity 漫画App下载图片宽高适配屏幕实现咨询

你当前的实现确实存在明显问题：修改localScale是对整个RectTransform做缩放变换，会导致Image组件的交互区域（比如点击、拖拽判定）和实际显示尺寸不匹配，还会影响挂载在该组件下的所有子元素，且你现有的尺寸计算逻辑是硬编码的固定规则，无法适配不同分辨率、不同比例的手机屏幕，很容易出现图片拉伸、超出显示区域的问题。

正确实现逻辑 #

核心思路是保持原图宽高比，根据目标显示区域（一般为屏幕可用区域/图片父容器尺寸）计算匹配的宽高，直接修改RectTransform的sizeDelta属性设置尺寸，不要修改缩放值。

完整实现代码 #

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Networking;
using System.Collections;

public class ImageDownloader : MonoBehaviour
{
    // 要赋值的目标Image组件
    public Image OImg;
    // 图片最大适配区域，默认取屏幕分辨率，也可以手动设置为父容器的尺寸
    public Vector2 maxDisplaySize = new Vector2(Screen.width, Screen.height);

    public IEnumerator GetImage(string url)
    {
        using (UnityWebRequest www = UnityWebRequestTexture.GetTexture(url))
        {
            yield return www.SendWebRequest();

            // 增加请求错误判断，避免崩溃
            if (www.result != UnityWebRequest.Result.Success)
            {
                Debug.LogError($"图片下载失败：{www.error}");
                yield break;
            }

            Texture2D myTexture = DownloadHandlerTexture.GetContent(www);
            
            // 计算原图宽高比
            float originalAspect = (float)myTexture.width / myTexture.height;
            
            // 计算适配后的宽高，两种方案二选一即可
            // 方案1：等比缩放至完全显示在屏幕内，不留黑边不截断，适合单页全图漫画
            float widthScale = maxDisplaySize.x / myTexture.width;
            float heightScale = maxDisplaySize.y / myTexture.height;
            float finalScale = Mathf.Min(widthScale, heightScale);
            float targetWidth = myTexture.width * finalScale;
            float targetHeight = myTexture.height * finalScale;

            // 方案2：竖屏长条滚动漫画常用适配，宽度撑满屏幕，高度自适应，和主流漫画App逻辑一致
            // float targetWidth = maxDisplaySize.x;
            // float targetHeight = targetWidth / originalAspect;

            // 创建Sprite赋值
            Rect rec = new Rect(0, 0, myTexture.width, myTexture.height);
            OImg.sprite = Sprite.Create(myTexture, rec, new Vector2(0.5f, 0.5f), 100f);
            
            // 直接修改RectTransform宽高，不要改缩放
            RectTransform imgRect = OImg.GetComponent<RectTransform>();
            imgRect.sizeDelta = new Vector2(targetWidth, targetHeight);
            // 可选：设置锚点为居中，保证图片在屏幕中间显示
            imgRect.anchoredPosition = Vector2.zero;
        }
    }
}

注意事项 #

• Sprite创建时的pivot设置为(0.5,0.5)保证图片居中对齐，100为Unity默认的像素 per unit 数值，不要随意修改
• 如果你的图片是放在滚动容器内的，可以把maxDisplaySize改成父容器的RectTransform的宽高即可适配容器尺寸
• 如果需要适配刘海屏等特殊屏型，可提前把maxDisplaySize替换为系统返回的安全区域尺寸即可

内容的提问来源于stack exchange，提问作者anas moussa