04. 手动计算调整控件分布
在不使用 Qt 布局器的情况下,我们可以手动规划各个控件的位置和尺寸设置,当然,这个手动计算的过程要根据不同界面进行不同的规划。手动计算调整控件分布的缺点就是没有什么通用性,换 个程序界面或者多一个控件、少一个控件都需要改写 cpp 文件中的源代码。接下来我们设计一个能跟随窗口大小变化而自动调整 各个控件分布和尺寸的程序。
新建QMainWindows项目,然后打开UI文件,设计如下:
● 首先是主界面窗体的大概情况设定:
主窗体第一行是非常大的标签控件 labelShow ,占据其他控件剩下的区域。
第二行是四个按压按钮,目前的尺寸都是 75*23 ,四个按钮的文字能全部显示出来,在窗口变大时,不需要拉伸,但是需要均匀分布在同一水平线上,四个按钮之间的间隔相同。
我们从这四个按钮计算主界面最小宽度,比如按钮间隔最小为 10,与两边框间距为 10,那么最小宽度就是
10 * 5 + 75 * 4 == 350 ,我们将主窗体最小高度设置为与最小宽度一样,比较省事,就是最小尺寸 350 * 350 ,最大尺寸不限。
主窗体第三行的控件就是一个水平滑动条 horizontalSlider ,我们希望它距离主窗体底部 10 ,宽度与第二行右边三个按钮占据宽度一样,水平滑动条高度是固定为原本的 21 。
● 现在我们来详细规划并计算各个控件的分布和尺寸:
这个主窗体的规划思路是这样的,控件之间以及控件与四个边界都是有 10 像素的间隙,然后水平方向因为第二行控件最多,并且第三行的水平滑动条依赖第二行右边三 个按钮,我们从这第二行开始规划。
当窗体拉伸后的宽度的 W,高度为 H ,按钮尺寸固定为 75*23 ,
第一个按钮的左上角起点坐标:
水平 x1 = 10,距离左边界为 10,这个是固定的。
垂直 y1 = H - 10 - 21 - 10 - 23 ,其中第一个 10 是水平滑动条距离底部的垂直空隙,21 是水平滑动条的高度,
第二个 10 是水平滑动条与按钮的垂直间隙,23 是按钮自己的高度。
四个按钮的在同一水平线上,也就是 y1 == y2 == y3 == y4。
第四个按钮也是距离右边界 10 个像素空隙,那么可以容易得出:
x4 = W - 10 - 75 ,75 是按钮自己的宽度。
四个按钮之间有三个大间隙,计算这个三个间隙总大小:
nTriGap = W - 10 - 10 - 754 ,两个 10 是两个边界间隙,754 是按钮自己占的宽度,那么单个的大间隙就为:
nGap = nTriGap / 3 。
然后计算第二个和第三个按钮的水平坐标:
x2 = x1 + 75 + nGap;
x3 = x4 - 75 - nGap.
这样四个按钮的坐标和尺寸就都确定了。
按钮设置好之后,其他的就好办了,第三行的水平滑动条:
xSlider = x2 ,
ySlider = H - 10 - 21 ,最后的 21 是滑动条自己的高度。
滑动条宽度是 wSlider = W - x2 - 10 ,高度固定为 hSlider = 21。
现在可以计算第一行的标签控件矩形了(其实应该是包裹标签的滚动区域矩形),标签坐标为:
xLabel = 10;
yLabel = 10;
现在要计算标签的宽度和高度,
宽度为 wLabel = W - 10 - 10;
高度为 hLabel = H - 10 - 21 - 10 - 23 - 10 - 10 。
高度计算里面第一个 10 是底部边界间隙, 21 是水平滑动条高度,
第二个 10 是水平滑动条与按钮的间隙,23 是按钮的高度,
第三个 10 是按钮与标签控件的间隙,
第四个 10 是标签距离顶部的间隙。
到这里按钮的分布情况就确定了。这个界面只有 6 个控件而已,如果控件再多些,计算就会更复杂了。
当窗口大小改变时,我们需要重载主窗体基类的事件函数: