(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

leslie_xin 發表於 2021-04-06

一、前言

當下,2K解析度已成為主流標配,3K、4K也已經廣泛應用。
在螢幕尺寸不變的情況下,高解析度也就意味著高DPI,對於桌面程式而言,除了先天就支援高DPI的框架外(如UWP、Electron等),大部分桌面程式如果不進行高DPI的適配,往往會出現介面模糊、控制元件錯位、文字顯示不全等問題。
目前網上關於高DPI適配的文章很少,大多隻是某個問題點的解決、某個DPI相關概念的講解,繁繁雜雜不成系統,也無跡可循。
本人曾對自己的軟體進行過高DPI的適配,在適配的過程中,遇到了很多問題,這些問題中有很多都沒有現成的答案,都是靠自己摸索和嘗試去解決的。
本著分享的精神,便有了本系列文章,著重分享一下自己在高DPI適配中的一些知識與經驗,同時也分享下自己是如何一步步發現、推理、歸納、總結出這些經驗的,希望這種一步步的過程,會對你有一些啟發。
當然,既然是“經驗”,肯定不會百分百的正確,也不會百分百的通用,但“經驗”的目的,就是讓人有跡可循,作為後來者的肩膀,使之可以前進得更遠。

相信看完的你,一定會有所收貨!

本文地址:https://www.cnblogs.com/lesliexin/p/14620222.html


二、縮放百分比與DPI之前的對應關係

(一),資訊的蒐集

1,縮放比例

在Win7中,使用者可自行設定的縮放百分比是:100%、125%、150%。
縮放比例的設定方法:
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

到了Win10,使用者可以自己設定的縮放百分比是100%~500%之間的任意比例。
縮放比例的設定方法:
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

2,DPI

在不進行縮放時,即縮放比例為100%時,系統的DPI是96。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

在縮放比例為125%時,DPI為120。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

在縮放比例為150%時,DPI為144。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

3,初步分析及問題發現

通過縮放比例與DPI的關係,我們可以發現,兩者的增加並不是1比1的關係,即:當縮放比例增加1時,DPI也增加1。
如果為1比1關係,那縮放比例為125%時,DPI應該是(125-100)+96=121;而現實DPI卻是120。同理,縮放比例為150%時,現實DPI是144,而不是(150-100)+96=146;

4,擴大樣本量

因為Win7中只能設定3種比例,因為樣本量太少,而無法正確歸納總結出規律。
但Win10足足可以設定100~500共401個縮放比例,樣本量足夠多,足以歸納總結出對應規律。
通過在Win10中進行大量的設定,發現了以下現象。

4.1,特殊的縮放比例

縮放比例每一個100間隔之間,就有8個特殊的縮放比例,這8個比例2個一組,對應同一個DPI的值。如下圖所示。
100%~200%
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

200%~300%
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

300%~400%
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

400%~500%
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

4.2,特殊縮放比例自動變化

這些特殊的縮放比例中,只能輸入圖中加粗的縮放比例,即使輸入前面的值,當你點選應用時,也會自動變成後面的值。
以特殊縮放比例是212為例,輸入212,點選“應用”按鈕,會自動變成213,也就是上圖中加粗的字型。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

4.3,除特殊縮放比例外的與DPI的對應關係。

通過樣本發現,在這些特殊縮殊縮放比例之間,縮放比例與DPI的增加關係是1比1的。
如:縮放比例為225時,DPI為226,其縮放比例與上一個特殊縮放比例213的差值是12,其DPI的與上一個特殊縮放比例213對應的DPI值204之前的差值也是12。同理,與下一個特殊縮放比例237(DPI:228)之間的差值也都是12。

在計算時通過引入對這些特殊縮放比例的處理,我們就可以正確計算出縮放比例所對應的DPI值。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

5,歸納

雖然已經可以通過引入特殊縮放比例來計算出正確的DPI值,但這並不是終點,還需要歸納出縮放比例與DPI之間的數學關係。
只有通過數學關係,才能不僅僅可以通過縮放比例來計算DPI,也可以通過DPI來計算出縮放比例。

通過簡單的歸納,我歸納出了兩者之間的數學關係。如下:

5.1,縮放比例->DPI

(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

5.2,DPI->縮放比例

(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係


三,總結

通過上面一步步發現縮放比例與DPI關係的流程,發現並沒有多少技術含量,更多的是耐心,也就是一些笨功夫。
在統計出那些特殊的縮放比例時,我並沒有將100~500之間共401個縮放比例一個個都進行設定,而是通過7、8個樣本推理出了一個結論,然後根據這個結論反推出幾組值,最後再通過手動設定來驗證這幾組值,最終得到了正確的結論。

通過上面總結出來的縮放比例與DPI的關係,我寫了個小工具,可以方便的在縮放比例與DPI之間換算。
(原創)高DPI適配經驗系列:(一)縮放比例與DPI對應關係

縮放比例與DPI轉換工具下載:https://files.cnblogs.com/files/lesliexin/ScaleFactor2Dpi.zip

-【END】-