1. Qt Designer 快速入門

Qt Designer 是交互式可視化GUI設(shè)計(jì)工具，可以幫助我們快速開(kāi)發(fā) PyQt 程序的速度。

它生成的 UI 界面是一個(gè)后綴為 .ui 的文件，可以通過(guò) pyiuc 轉(zhuǎn)換為 .py 文件。

1.1 新建主窗口

在模板選項(xiàng)中，最常用的是 Widget (通用窗口) 和 Main Window (主窗口)。

1.2 窗口主要區(qū)域介紹

Widget Box 其中提供了很多控件，可以直接拖放到主窗口中。在菜單欄選擇 “Form” -> "Preview", 或者按“Ctrl + R”即可預(yù)覽。

Object Inspactor 里邊是對(duì)象列表，可以看出對(duì)象的層次關(guān)系。

Property Editor 可以編輯對(duì)象的屬性

Signal / slot Editor 編輯信號(hào)，管理圖片

1.3 將 ui 文件轉(zhuǎn)為 py 文件

利用 加載好的 PyUIC 工具 轉(zhuǎn)變?yōu)?py

轉(zhuǎn)換成功的 myMainWindow.py 代碼如下所示

# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'myMainWindow.ui'
#
# Created by: PyQt5 UI code generator 5.6
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_myMainWindow(object):
    def setupUi(self, myMainWindow):
        myMainWindow.setObjectName("myMainWindow")
        myMainWindow.resize(800, 600)
        self.centralwidget = QtWidgets.QWidget(myMainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.pushButton = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton.setGeometry(QtCore.QRect(140, 270, 75, 23))
        self.pushButton.setObjectName("pushButton")
        myMainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(myMainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 23))
        self.menubar.setObjectName("menubar")
        myMainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(myMainWindow)
        self.statusbar.setObjectName("statusbar")
        myMainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(myMainWindow)
        QtCore.QMetaObject.connectSlotsByName(myMainWindow)

    def retranslateUi(self, myMainWindow):
        _translate = QtCore.QCoreApplication.translate
        myMainWindow.setWindowTitle(_translate("myMainWindow", "MainWindow"))
        self.pushButton.setText(_translate("myMainWindow", "Confirm"))

1.4 界面與邏輯分離

通過(guò)轉(zhuǎn)換 ui 文件為 py 文件，得到的只是界面的 ui 的類, 并不包括啟動(dòng)界面的函數(shù)，我們稱之為界面文件。需要一個(gè)新建一個(gè) py 文件調(diào)用文件，這個(gè)新建的文件我們稱為邏輯文件。

新建一個(gè) CallmyMainWindow.py 代碼如下

# -*- coding: utf-8 -*-

import sys
from PyQt5.QtWidgets import QApplication , QMainWindow
from myMainWindow import *

class MyMainWindow(QMainWindow, Ui_myMainWindow):
    def __init__(self, parent=None):
        super(MyMainWindow, self).__init__(parent)
        self.setupUi(self)

if __name__=="__main__":
    # 每一pyqt5應(yīng)用程序必須創(chuàng)建一個(gè)應(yīng)用程序?qū)ο蟆ys.argv參數(shù)是一個(gè)列表，從命令行輸入?yún)?shù)。
    app = QApplication(sys.argv)
    myWin = MyMainWindow()
    # 顯示在屏幕上
    myWin.show()
    # 系統(tǒng)exit()方法確保應(yīng)用程序干凈的退出
    # 的exec_()方法有下劃線。因?yàn)閳?zhí)行是一個(gè)Python關(guān)鍵詞。因此，exec_()代替
    sys.exit(app.exec_())

2. 布局

2.1 布局管理器布局

四種布局方式

新建一個(gè)文本框( lineEdit) 和一個(gè)按鈕 ( pushButton ).選中右鍵布局

# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_myMainWindow(object):
    def setupUi(self, myMainWindow):
        myMainWindow.setObjectName("myMainWindow")
        myMainWindow.resize(800, 600)
        self.centralwidget = QtWidgets.QWidget(myMainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.widget = QtWidgets.QWidget(self.centralwidget)
        self.widget.setGeometry(QtCore.QRect(130, 190, 216, 25))
        self.widget.setObjectName("widget")
        self.horizontalLayout = QtWidgets.QHBoxLayout(self.widget)
        self.horizontalLayout.setContentsMargins(0, 0, 0, 0)
        self.horizontalLayout.setObjectName("horizontalLayout")
        self.lineEdit = QtWidgets.QLineEdit(self.widget)
        self.lineEdit.setObjectName("lineEdit")
        self.horizontalLayout.addWidget(self.lineEdit)
        self.pushButton = QtWidgets.QPushButton(self.widget)
        self.pushButton.setObjectName("pushButton")
        self.horizontalLayout.addWidget(self.pushButton)
        myMainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(myMainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 23))
        self.menubar.setObjectName("menubar")
        myMainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(myMainWindow)
        self.statusbar.setObjectName("statusbar")
        myMainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(myMainWindow)
        QtCore.QMetaObject.connectSlotsByName(myMainWindow)

    def retranslateUi(self, myMainWindow):
        _translate = QtCore.QCoreApplication.translate
        myMainWindow.setWindowTitle(_translate("myMainWindow", "MainWindow"))
        self.pushButton.setText(_translate("myMainWindow", "Confirm"))

　　

QpushButton 和 QlineEdit 構(gòu)建時(shí)父對(duì)象都是 QWidget 布局對(duì)象 QHBoxLayout 也是。

2.2 使用容器進(jìn)行布局

在左側(cè) Containers 拖入一個(gè) frame 控件，然后放入 LineEdit 、 Button 控件。

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_myMainWindow(object):
    def setupUi(self, myMainWindow):
        myMainWindow.setObjectName("myMainWindow")
        myMainWindow.resize(800, 600)
        self.centralwidget = QtWidgets.QWidget(myMainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.frame = QtWidgets.QFrame(self.centralwidget)
        self.frame.setGeometry(QtCore.QRect(170, 270, 411, 161))
        self.frame.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.frame.setFrameShadow(QtWidgets.QFrame.Raised)
        self.frame.setObjectName("frame")
        self.lineEdit = QtWidgets.QLineEdit(self.frame)
        self.lineEdit.setGeometry(QtCore.QRect(20, 50, 214, 20))
        self.lineEdit.setObjectName("lineEdit")
        self.pushButton = QtWidgets.QPushButton(self.frame)
        self.pushButton.setGeometry(QtCore.QRect(280, 50, 75, 23))
        self.pushButton.setObjectName("pushButton")
        myMainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(myMainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 23))
        self.menubar.setObjectName("menubar")
        myMainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(myMainWindow)
        self.statusbar.setObjectName("statusbar")
        myMainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(myMainWindow)
        QtCore.QMetaObject.connectSlotsByName(myMainWindow)

    def retranslateUi(self, myMainWindow):
        _translate = QtCore.QCoreApplication.translate
        myMainWindow.setWindowTitle(_translate("myMainWindow", "MainWindow"))
        self.pushButton.setText(_translate("myMainWindow", "Confirm"))

容器Qframe 與子控件之間有一個(gè) QHBoxLayout,使用容器進(jìn)行控件布局本質(zhì)上還是調(diào)用布局管理器進(jìn)行的。

總結(jié)

以上是生活随笔為你收集整理的Qt Designer 的使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。