Unity全屏圖片適應

美術設計效果圖使用一個固定屏幕分辨率，為何和實際顯示屏幕分辨率區分開，我把它叫做設計分辨率，按照這個大小做出效果圖，導出背景圖可以對圖片壓縮比設計分辨率小。
依照設計分辨率對圖片分辨率寬高進行等比縮放，這樣超出屏幕顯示區域的內容不可見，背景圖片也不會拉升（可能會因為圖片分辨率太小縮放后模糊）。

// UnityEngine.Screen 獲取屏幕分辨率
public static Vector2 GetScreenSize()
{
    return new Vector2(Screen.width, Screen.height);
}

設計分辨率是美術同學參照某個固定分辨率制作效果圖，比如我固定設計分辨率是1334*750.
圖片分辨率通過self.imageBg.transform.sizeDelta獲取。

在Canvas Scaler手動指定屏幕拉伸分辨率，讓Canvas RectTransform寬高永遠不小於當前分辨率，以當前分辨率對界面Canvas拉伸。

這么個小Canvas Scaler參數概念還真是多，英語不好看個文檔還要翻譯(* ￣︿￣)

UI Scale Mode: Scale With Screen Size

按照Reference Resolution分辨率對屏幕分辨率拉伸處理，使屏幕分辨率不小於Reference Resolution分辨率，這樣的好處是所有分辨率下的UI圖片都會是原始分辨率或者輕度拉伸，不會有過度縮放帶來的圖片模糊或者銳化，上文說的設計分辨率就是這個Reference Resolution。

Screen Match Mode用屏幕分辨率寬高比對畫布分辨率進行縮放。
重點說下Screen Match Mode的Expand和Shrink:

• Expand (screenWidth / screenHeight) > (resolutionWidth / resolutionHeight)，以Height為基准對Width縮放。
• Shrink (screenWidth / screenHeight) > (resolutionWidth / resolutionHeight)，以Width為基准對Height縮放。

其實弄個Canvas隨便調下參數看看結果，都比純粹文字好理解吧，文字只是記錄我的理解結果。

回到全屏圖片適應話題，設計分辨率確定了，接下來要開始換算，計算出分辨率下的圖片縮放比。

function GetFullScreenSpriteSize(spriteWidth, spriteHeight)
    local retWidth, retHeight = 0, 0

    local size = PlatformDevice.GetScreenSize()
    local screenWidth, screenHeight = size.x, size.y
    local designWidth, designHeight = GetDesignResolution()

    -- 根據屏幕分辨率寬高比，計算出新的Canvas resolutionSize，得到UI需要顯示的分辨率
    if (screenWidth / screenHeight) > (designWidth / designHeight) then
        -- 屏幕長，對Canvas寬拉伸到屏幕比例
        designWidth = screenWidth / screenHeight * designHeight
    else
        -- 屏幕高，對Canvas高拉伸到屏幕比例
        designHeight = screenHeight / screenWidth * designWidth
    end

    -- 對圖片縮放，圖片分辨率和設計分辨率相差大的邊作為縮放比，等比例縮放圖片
    local scaleRate = 1
    if (designWidth / designHeight) > (spriteWidth / spriteHeight) then
        scaleRate = designWidth / spriteWidth
    else
        scaleRate = designHeight / spriteHeight
    end
    retWidth = spriteWidth * scaleRate
    retHeight = spriteHeight * scaleRate

    return retWidth, retHeight
end

這么一段代碼看似和Unity UI控件沒什么關系，設計分辨率也是GetDesignResolution()=1334750中寫死，但解讀過程中不禁好奇為什么是1334750，難道僅僅是美術同學設計稿尺寸嗎，那和Canvas縮放有什么關系，為何圖片縮放到Canvas大小要考慮這么個分辨率，而不是直接獲取Canvas的分辨率對圖片縮放呢，這個設計分辨率和Camera的渲染分辨率也沒有關系，工程內的Camera viewport也沒有定義分辨大小，所以產生一個❓這個設計分辨率是怎么回事，從哪里來，為何參與圖片全屏計算。

搞清楚上一個設計分辨率問號后，新的疑問產生：為何要選擇UI Scale Mode-Screen Match Mode-Expand，原因似乎很簡單，如果從1334750的設計尺寸放到手機21801080呢（現在都是越來越大的分辨率），那圖片要拉伸2倍圖片要糊啦，選擇Expand的目的就是盡可能保持原有的圖片分辨率不做太大的圖片拉伸，保持原有的圖片視覺體驗。