(原创)高DPI适配经验系列:(一)缩放比例与DPI对应关系

一、前言

当下,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%。
缩放比例的设置方法:

到了Win10,用户可以自己设定的缩放百分比是100%~500%之间的任意比例。
缩放比例的设置方法:

2,DPI

在不进行缩放时,即缩放比例为100%时,系统的DPI是96。

在缩放比例为125%时,DPI为120。

在缩放比例为150%时,DPI为144。

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%

200%~300%

300%~400%

400%~500%

4.2,特殊缩放比例自动变化

这些特殊的缩放比例中,只能输入图中加粗的缩放比例,即使输入前面的值,当你点击应用时,也会自动变成后面的值。
以特殊缩放比例是212为例,输入212,点击“应用”按钮,会自动变成213,也就是上图中加粗的字体。

4.3,除特殊缩放比例外的与DPI的对应关系。

通过样本发现,在这些特殊缩殊缩放比例之间,缩放比例与DPI的增加关系是1比1的。
如:缩放比例为225时,DPI为226,其缩放比例与上一个特殊缩放比例213的差值是12,其DPI的与上一个特殊缩放比例213对应的DPI值204之前的差值也是12。同理,与下一个特殊缩放比例237(DPI:228)之间的差值也都是12。

在计算时通过引入对这些特殊缩放比例的处理,我们就可以正确计算出缩放比例所对应的DPI值。

5,归纳

虽然已经可以通过引入特殊缩放比例来计算出正确的DPI值,但这并不是终点,还需要归纳出缩放比例与DPI之间的数学关系。
只有通过数学关系,才能不仅仅可以通过缩放比例来计算DPI,也可以通过DPI来计算出缩放比例。

通过简单的归纳,我归纳出了两者之间的数学关系。如下:

5.1,缩放比例->DPI

5.2,DPI->缩放比例


三,总结

通过上面一步步发现缩放比例与DPI关系的流程,发现并没有多少技术含量,更多的是耐心,也就是一些笨功夫。
在统计出那些特殊的缩放比例时,我并没有将100~500之间共401个缩放比例一个个都进行设置,而是通过7、8个样本推理出了一个结论,然后根据这个结论反推出几组值,最后再通过手动设置来验证这几组值,最终得到了正确的结论。

通过上面总结出来的缩放比例与DPI的关系,我写了个小工具,可以方便的在缩放比例与DPI之间换算。

缩放比例与DPI转换工具下载:https://files.cnblogs.com/files/lesliexin/ScaleFactor2Dpi.zip

-【END】-

posted @ 2021-04-06 13:55  leslie_xin  阅读(4069)  评论(7编辑  收藏  举报