QT的栅格布局详解

        栅格布局（QGridLayout），也称网格布局，是一种将窗口分割为行和列的网格，每个控件放置在网格的一个或多个单元格内排列的一种布局，我们可以根据需要指定行数和列数，以决定网格的大小和布局。

       网格布局非常的高效和灵活，当需要增加或删除控件时，很容易地就可以调整，而不需要重新打破原有的布局重新来过。

界面设置栅格布局

        我们先任意拖动一些控件，随意摆放，然后选中第一层的QWidget，在点击栅格布局图标

        可以看到，布局按照控件的摆放，自动分割成了一个 3 * 3的网格布局，一个控件占用一个网格，如果想调整位置，按住控件拖动即可

        我们可以看到，栅格布局的属性一部分与水平布局相同（layoutLeftMargin、layoutTopMargin、layoutRightMargin、layoutBottomMargin、layoutSizeConstraint），用法参考上一篇QT的水平布局详解

1、layoutHorizontalSpacing：控件间的水平间距，也就是栅格布局中并排排列的部件之间的间距

2、layoutVerticalSpacing：控件间的垂直间距，也就是栅格布局中上下排列的控件间距

3、layoutRowStretch：设置指定行的拉伸因子，拉伸因子决定当窗口大小改变时，行所占用的空间大小。拉伸因子数值越大，行得到的空间就越多

4、layoutColumnStretch：设置指定列的拉伸因子，拉伸因子数值越大，列得到的空间就越多

5、layoutRowMinimumHeight：设置指定行的最小高度，可以随着窗口的增大而增大

6、layoutColumnMinimumHeight：设置指定列的最小高度，可以随着窗口的增大而增大

布局示例

        这里我们举几个使用栅格布局画页面的示例，为了更清晰看清楚，子控件使用不同背景颜色的Wigdet，实际使用中可以替换为任意控件

1、如图界面，我们可以分为图中的六个部分来布局

        放置六个widget，如图

         设置最外层为栅格布局，一般标签、按钮会固定高度，所以我们设置为高度固定，页面布局大概就搞定了

2、这个页面，我们分为九个区域来看

        还是先拖进来控件，然后修改最外层为栅格布局

        第一行和第二行与之前一样，正常一个控件占一个格子，第三行的一个控件需要跨四个格子的区域，直接拖动边框调整大小占满整行，按照每一行的高度比例，我们设置layoutRowStretch为 1，3，2，效果如图

代码编写栅格布局

        以这个界面为例，我们用代码来实现大概布局

1、打开一个空界面对应的 .cpp文件

2、创建每一个控件，控件如何摆放，代码见下图

3、运行一下看下效果

4、如果想让右下角的两个按钮只占一个格子的一半，我们可以用到一个弹簧控件来占用一部分空间

​​​​​​​

5、再运行看下效果