当前位置:C++技术网 > 资讯 > 界面设计问题(屏幕分辨率问题)

界面设计问题(屏幕分辨率问题)

更新时间:2017-04-07 18:48:17浏览次数:1+次

我在14寸笔记本上生成程序,界面及控件都调整好了,分辨率1366*768;

但是将项目在台式机上运行,发现控件都变了位置,调整了分辨率改为笔记本分辨率也不行,这是为啥?

笔记本界面:

20寸台式机:

该如何处理?


C++技术网会员解答:

    首先请阅读下面两篇文章:

1.如何设置显示分辨率才会让屏幕显示最清楚

2.Win32桌面程序为什么要适配高DPI

    还是感谢您对C++技术网的信任和支持。

    以上的文章,仅仅是让你对分辨率有一个印象。回到我们这个问题,为什么我们换了分辨率,程序界面会发生变化呢?这得从软件界面的实现说起。

    你肯定知道像素这个概念。像素对应的是物理设备的实际显示的单位。通常叫做像素点。一个像素就对应设备上的一个点。如果你的界面是基于像素来布局的,那么不管分辨率如何,你的界面都不会变化。这样好不好呢?我们来详细聊聊。

    在不同的分辨率下,像素大小会发生改变。分辨率越低(数值小),像素点越大,画面看起来很大,像放大了一样。分辨率越高(数值大),像素点越小,那么画面就看起来很小,可以容纳很多东西,像缩小了一样。

    如果你这个程序是基于像素布局的,那么分辨率变化了,软件界面是不会有什么变化的。下面看看示意图:

界面设计问题(屏幕分辨率问题)

    你发现了什么?在分辨率低的时候,五角星所在的位置在中间,五角星很大。当分辨率很高的时候,五角星跑到了左上角,而且五角星很小。分辨率变高,五角星不仅位置发生了变化,而且大小也变化了。

    这样一来,不同的分辨率看到的画面,差异太大了。而屏幕大小各种各样,没法统一。所以,这样实现的界面,太不友好了。你在使用win10时,高分辨率屏幕,就有界面适配问题,让人感觉太怪异了。有的程序很清晰,有的程序很模糊。

    而你在调整分辨率时,你有没有发现,分辨率改变了,整个窗口和周围的位置的比例,大小比例基本是差不多。只不过个别控件发生了错位。不过相比于基于像素的实现,效果好很多。在不同分辨率下,界面还是很一致的,让人很好接受。这个模式就是基于逻辑点的模式。Windows会自动根据你设定的逻辑点的长宽,以及和周围的距离,得到一个逻辑点单位的坐标和大小。而这个逻辑点对应到实际的像素点,则由系统自动转换。也正因如此,你的程序在分辨率改变的时候,大小位置基本是比例是没有多少变化的。

    所以,我们编程时设定窗口控件大小位置的时候,一般都是用逻辑点单位。但是问题是,逻辑点单位只是简单的与像素点进行转换,得到一个整体的效果。而我们在实现控件布局的时候,仅仅这样是不够的。这也就是出现你这样的错位的情况。

    如果经常涉及到分辨率的转换的场景,那么你就需要好好考虑分辨率的问题。

    所以我们可以大致将逻辑点理解为比例单位,是相对的单位。而像素单位则是绝对单位。既然逻辑点是相对比例单位,那么我们就要知道,在分辨率变化的时候,比例是会发生变化的,而这个变化就可能带来错位的情况。

    如何解决错位问题?我们可以看到,登录标签是不是正常的?是的。其他控件也是正常的。为什么他们能正常呢?不妨试着从这个地方来找差异点。答案就出来了。

    既然是比例,那么我们可以在分辨率改变的时候,重新调整一下控件的大小和位置。而我们从系统获取到的,是窗口控件的逻辑点单位,这就够了。我们只要在分辨率变化的时候,我们获取窗口的大小,然后重新设置一下控件的位置和大小就行。而设置的方式就是按照比例来设置就行了。

    分辨率改变之后,系统会给窗口发送消息WM_DISPLAYCHANGE,然后可以用下面的代码获取屏幕的大小:

int winWidth = GetSystemMetrics(SM_CXSCREEN);
int winHeight = GetSystemMetrics(SM_CYSCREEN)
   然后再获取窗口的大小,来调整控件的大小。这样的话,不管在什么样的分辨率下,都可以得到合适的控件大小比例。