QT Creator/QT Designer水平布局/垂直布局/控件位置自适应

        在这篇文章，你将会阅读到Qt的可视化界面设计编辑工具QT Creator/QT Designer最重要的使用注意事项（如何让窗体内的控件实现全局自适应，以及如何使用垂直布局和水平布局），本人经常也犯此类错误，因此记录了这篇文章。
        关键字：QT Creator，QT Designer，水平布局，垂直布局，控件居中，控件充满窗体。

一、界面设计需求/学习需求

        在Windows窗体应用中，我们常常需要考虑其布局和自适应的问题，比如说两个button如何变成水平布局，一个label如何居中，一个button如何居中，或者一个widget如何居中。但是对于我们这些初学者而言，网上的博客大都侃侃而谈，像我这种菜鸡很难去get到其中真正的布局使用方法，真的，我看了十几篇了，实现的确是我想要的效果，但是一到Designer上面呵呵呵呵呵，不知道如何下手。在这里，我将记录一下两个button（比如垂直的登录注册按钮）是如何变成一个整体的控件（水平布局或者垂直布局），以及在全局如何实现自适应（居中）。你需要有以下的环境：

1. 一台电脑 ；
2. Qt Creator或者Qt Designer 。
   
   

二、水平布局和垂直布局

        1、 水平布局
        水平布局的对象可以是label、button、widget、spacer以及其他控件。这里，我使用Qt Designer，以两个QPushButton为例，构建一个水平布局的示例。
        第一步，Qt Designer->文件，新建一个窗体，它可以是MainWindow或者Widget都行。如下图所示。

        第二步，往左边的控件栏拖动两个PushButton。如下图所示。

        第三步，选中两个PushButton（按住ctrl键，鼠标单击就行）。如下图所示。

        第四步，点击Qt Designer顶部的工具栏中的下面一个图标，它就表示创建水平布局的按钮。如图所示。然后这就是水平布局的使用方法，它可以从PushButton推广到Qt的其他控件，比如选中一个PushButton和一个QWidget或者Label，都是可以的。

        第五步，得到以下水平布局，如图。




        2、 垂直布局
        第一步，往左边的控件栏再拖动两个PushButton或者Label也行。
        第二步，点击Qt Designer顶部的工具栏中的下面一个图标，它就表示创建垂直布局的按钮。如图所示。跟水平布局的使用方法类似。

        第三步，得到如下图所示的垂直布局。

三、控件位置全局自适应

        这里所说的全局自适应是说，是指在一个窗体里面，控件的位置会随着窗口的变化而变化，而不是固定在某一个位置。例如，一个button在窗体中的水平居中或者垂直居中。但是初学者遇到最多的问题可能是，知道怎么使用水平和垂直的Spacer，但是这个spacer没有办法填充整个窗体。实际上，这个问题也算控件居中问题吧。下面就是这个问题的解决方案。
        问题如图所示，无论窗口如何变化，对于整个窗体而言spacer一直不起作用（本来想实现随着窗体宽度变化，那一组控件可以一直居中，那一组控件的宽度一直不变）。

        实际上，这是因为对于根Widget，我们没有给出它的布局。只要给这个根Widget一个布局，它就可以实现控件位置的全局自适应了。

        例如，我设置根Widget控件的布局为垂直，那么就会得到如下的效果：随意改变窗体的宽度，这两个PushButton（构成一组控件）就能够一直居中啦。

四、参考资料

[1]:QT Creator设计窗体的时候如何把控件给占满窗口， QTCN开发网 http://www.qtcn.org/bbs/simple/?t33073.html