PyQt之QHBoxLayout、QVBoxLayout 与QGridLayout

一. QHBoxLayout
先来看官方对QHBoxLayout 是怎样介绍的，原文如下：
The QHBoxLayout class lines up widgets horizontally.
QHBoxLayout 类将各部件水平排列。
This class is used to construct horizontal box layout objects. See QBoxLayout for details.
这个类用来构建水平框布局对象，更详细的信息请看QBoxLayout。
The simplest use of the class is like this:
这个类最简单的用法像下面这样：

     QWidget *window = new QWidget;     QPushButton *button1 = new QPushButton("One");     QPushButton *button2 = new QPushButton("Two");     QPushButton *button3 = new QPushButton("Three");     QPushButton *button4 = new QPushButton("Four");     QPushButton *button5 = new QPushButton("Five");     QHBoxLayout *layout = new QHBoxLayout;     layout->addWidget(button1);     layout->addWidget(button2);     layout->addWidget(button3);     layout->addWidget(button4);     layout->addWidget(button5);     window->setLayout(layout);     window->show();

First, we create the widgets we want in the layout. Then, we create the QHBoxLayout object and add the widgets into the layout. Finally, we call QWidget.setLayout() to install the QHBoxLayout object onto the widget. At that point, the widgets in the layout are reparented to have window as their parent.
首先，在这个布局里面我们创建了我们想要的widget(部件)。 然后，我们创建了QHBoxLayout类的一个对象并且把我们刚才创建的widget(部件)加入到了这个对象里。 最后，我们调用了QWidget.setLayout()方法将QHBoxLayout对象“安装”到了widget里。在那一点上，布局里的各个widget（部件）让window(窗口)成为了他们的父部件（这句真不好翻译，翻得不对请高手赐教^_^）。
上面的描述是官方介绍的，其实说白了就是，先定义一个QHBoxLayout对象（new出来），然后调用该对象的addWidget方法添加部件（按钮、文本等等），
这些刚刚添加进去的部件们在布局管理器中是水平排列的。这个时候这些部件是不能显示的，我们还要将他们与一个对象（QWidget对象、
QMainWindow对象或QDialog对象）进行“绑定”（原文里是install），然后调用该对象的show方法才能显示出来。

import sysfrom PyQt4 import QtGuiclass HLayout(QtGui.QWidget):    def __init__(self):        QtGui.QWidget.__init__(self)        button1 = QtGui.QPushButton("1")        button2 = QtGui.QPushButton("2")        button3 = QtGui.QPushButton("3")        button4 = QtGui.QPushButton("4")        button5 = QtGui.QPushButton("5")        hbox = QtGui.QHBoxLayout()        hbox.addStretch(10)        hbox.addWidget(button1)        hbox.addWidget(button2)        hbox.addWidget(button3)        hbox.addWidget(button4)        hbox.addWidget(button5)        self.setLayout(hbox)        self.setWindowTitle('box layout')        self.resize(300, 400)app = QtGui.QApplication(sys.argv)ex = HLayout()ex.show()sys.exit(app.exec_())

大家将该文件保存为’name’(自己取个名字).py，只要搭建好了PyQt的开发环境就可双击运行它了（至于怎么搭建环境请参考我另一篇博客）。
运行效果如下图所示：

二. QVBoxLayout
我们先来看官方解释：
The QVBoxLayout class lines up widgets vertically.
QVBoxLayout 类将各部件垂直排列。
This class is used to construct vertical box layout objects. See QBoxLayout for details.
这个类用来构建垂直框布局对象，更详细的信息请看QBoxLayout。
The simplest use of the class is like this:
这个类最简单的用法像下面这样：

QWidget *window = new QWidget;     QPushButton *button1 = new QPushButton("One");     QPushButton *button2 = new QPushButton("Two");     QPushButton *button3 = new QPushButton("Three");     QPushButton *button4 = new QPushButton("Four");     QPushButton *button5 = new QPushButton("Five");     QVBoxLayout *layout = new QVBoxLayout;     layout->addWidget(button1);     layout->addWidget(button2);     layout->addWidget(button3);     layout->addWidget(button4);     layout->addWidget(button5);     window->setLayout(layout);     window->show();

First, we create the widgets we want in the layout. Then, we create the QVBoxLayout object and add the widgets into the layout. Finally, we call QWidget.setLayout() to install the QVBoxLayout object onto the widget. At that point, the widgets in the layout are reparented to have window as their parent.
首先，在这个布局里面我们创建了我们想要的widget(部件)。然后，我们创建了QVBoxLayout类的一个对象并且把我们刚才创建的widget(部件)加入到了这个对象里。 最后，我们调用了QWidget.setLayout()方法将QVBoxLayout对象“安装”到了widget里。在那一点上，布局里的各个widget（部件）让window(窗口)成为了他们的父部件。
由于这个与QHBoxLayout类似，我们就不做过多介绍了，直接看PyQt怎么用这个类：

import sysfrom PyQt4 import QtGuiclass VLayout(QtGui.QWidget):    def __init__(self):        QtGui.QWidget.__init__(self)        button1 = QtGui.QPushButton("1")        button2 = QtGui.QPushButton("2")        button3 = QtGui.QPushButton("3")        button4 = QtGui.QPushButton("4")        button5 = QtGui.QPushButton("5")        vbox = QtGui.QVBoxLayout()        vbox.addStretch(1000)        vbox.addWidget(button1)        vbox.addWidget(button2)        vbox.addWidget(button3)        vbox.addWidget(button4)        vbox.addWidget(button5)        self.setLayout(vbox)        self.setWindowTitle('box layout')        self.resize(300, 400)app = QtGui.QApplication(sys.argv)ex = VLayout()ex.show()sys.exit(app.exec_())

运行效果如下图所示：

三. QGridLayout
这个类比较重要，我们讲得详细一点。
同样的，我们先来看官方的介绍，不能跳过这一part，毕竟官方是最权威的^_^。
The QGridLayout class lays out widgets in a grid.
QGridLayout类将各个widget(部件)按grid(网格)排列。
QGridLayout takes the space made available to it (by its parent layout or by the parentWidget()), divides it up into rows and columns, and puts each widget it manages into the correct cell.
QGridLayout获取可用空间（这些空间来自于父layout(布局)或调用parentWidget方法返回的layout），将这些空间分割为行和列，然后将他管理的每个widget（部件）依次放进正确的格子（注：cell原意为细胞、小房子，请原谅我将它翻成格子^_^）里。
Columns and rows behave identically; we will discuss columns, but there are equivalent functions for rows.
行和列表现相同；我们将讨论列，但是对于行都有equivalent(等价的，相等的)方法。
Each column has a minimum width and a stretch factor. The minimum width is the greatest of that set using setColumnMinimumWidth() and the minimum width of each widget in that column. The stretch factor is set using setColumnStretch() and determines how much of the available space the column will get over and above its necessary minimum.

Normally, each managed widget or layout is put into a cell of its own using addWidget(). It is also possible for a widget to occupy multiple cells using the row and column spanning overloads of addItem() and addWidget(). If you do this, QGridLayout will guess how to distribute the size over the columns/rows (based on the stretch factors).

To remove a widget from a layout, call removeWidget(). Calling QWidget.hide() on a widget also effectively removes the widget from the layout until QWidget.show() is called.
每列都有一个最小宽度和一个伸展因子。调用setColumnMinimumWidth方法可设置最小宽度，调用setColumnStretch方法可设置伸展因子，伸展因子决定了在所需的最小宽度之上的可用空间。
通常来说，调用addWidget方法可将他所管理的widget（部件）或layout（布局）添加进自己的cell（小房子，“格子”）中。重载addItem方法和addWidget方法来实现一个widget的跨越多行是可能的。如果你这样做了，QGridLayout 将猜测如何分发行/列的大小（基于伸展因子）。
调用removeWidget方法可从布局上去掉一个widget（部件）。调用QWidget.hide()方法也可有效的从布局上“去掉”widget（部件），直到QWidget.show() 方法被调用。
我们来看一个例子：

import sysfrom PyQt4 import QtGuiclass GridLayout(QtGui.QWidget):    def __init__(self):        QtGui.QWidget.__init__(self)        self.setWindowTitle('grid layout')        names = ['1', '2', '3', '4', '5', '6', '7', '8',            '9', '10', '11', '12', '13', '14', '15', '16',            '17', '18', '19', '20']        grid = QtGui.QGridLayout()        j = 0        pos = [(0, 0), (0, 1), (0, 2), (0, 3),                (1, 0), (1, 1), (1, 2), (1, 3),                (2, 0), (2, 1), (2, 2), (2, 3),                (3, 0), (3, 1), (3, 2), (3, 3 ),                (4, 0), (4, 1), (4, 2), (4, 3)]        for i in names:            button = QtGui.QPushButton(i)            grid.addWidget(button, pos[j][0], pos[j][1])            j = j + 1        self.setLayout(grid)app = QtGui.QApplication(sys.argv)ex = GridLayout()ex.show()sys.exit(app.exec_())

程序很简单，运行效果如下图所示：

视频教程见：http://www.duobei.com/course/6238671512