【PyQt4】学习2 之-BoxLayout布局、网格GridLayout布局，实现计算器界面设计

本文链接：https://blog.youkuaiyun.com/wsLJQian/article/details/97272303

本文详细介绍了PyQt4中的BoxLayout和GridLayout布局管理器的使用方法，通过实例展示了如何利用这两种布局方式来设计界面，包括按钮的排列和计算器界面的布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本系列文章前情回顾：

PyQt4学习1之---菜单栏（addMenu）、工具栏（addToolBar）、TextEdit工具框

设计好的button、lineEdit等等工具，就需要将这些在洁面上进行排布，就需要Box布局、网格Grid布局

一、BoxLayout水平/垂直布局

PyQt4 Box布局

# -*- coding: utf-8 -*-
import sys
from PyQt4 import QtCore
from PyQt4 import QtGui

QtCore.QTextCodec.setCodecForTr(QtCore.QTextCodec.codecForName("utf8"))

class BoxLayout(QtGui.QWidget):
    def __init__(self, parent=None):
        QtGui.QWidget.__init__(self)

        self.setWindowTitle(u'Box布局')

        # 设定按钮
        ok=QtGui.QPushButton(u'确定')
        cancel = QtGui.QPushButton(u'取消')

        # 水平布局
        hbox = QtGui.QHBoxLayout()
        hbox.addStretch(1)  # 添加伸缩间隔元素，创建必须的空白空间
        hbox.addWidget(ok)
        hbox.addWidget(cancel)

        # 垂直布局
        vbox = QtGui.QVBoxLayout()
        vbox.addStretch(1)
        vbox.addLayout(hbox)    # 把水平布局放在垂直布局里面

        self.setLayout(vbox)    # 设置窗口的主布局

        self.resize(400, 250)


if __name__ == "__main__":
    app=QtGui.QApplication(sys.argv)
    b=BoxLayout()
    b.show()
    app.exec_()

下面是整个图的设计阶段草图，也是显示窗口后，呈现的样子。

二、GridLayout网格布局，设计计算器

设计一个计算器，是网络上一个比较经典的学习案例。这里主要涉及到采用网格布局，实现对那么多按键的位置排列，从而达到对这部分内容的进一步掌握。代码如下：

class GridLayout(QtGui.QWidget):
    def __init__(self, parent=None):
        QtGui.QWidget.__init__(self)

        self.setWindowTitle(u'Grid计算器网格布局')

        names=[u'清除', u'后退',"", u'关闭',
               '7', '8', '9', '/',
               '4', '5', '6', '*',
               '1', '2', '3', '-',
               '0', '.', '=', '+']

        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)
            if j == 2:
                grid.addWidget(QtGui.QLabel(''), 0, 2)
            else:
                grid.addWidget(button, pos[j][0], pos[j][1])
            j += 1


        self.setLayout(grid)    # 设置窗口的主布局



if __name__ == "__main__":
    app=QtGui.QApplication(sys.argv)

    b=GridLayout()
    b.show()
    app.exec_()

如果你和我一样有点粗心，可能就出现下面的结果了，是一个空格惹的祸，如下面这样：