Python界面 可視化開發（python3+PyQt5+Qt Designer）

前言

       以前制作一個Python窗體界面，我都是用GUI視窗視窗設計的子產品Tkinter一點一點敲出來的，今天朋友問我有沒有Python窗體的設計工具，“用滑鼠拖拖”就能完成窗體設計，我查了查相關資料，果然有一款好用的工具——Qt Designer。

 1.安裝Qt Designer

        這裡需要安裝兩個東西：PyQt5和PyQt5-tools：

• 安裝PyQt5：打開CMD或者PowerShell，在指令窗中輸入

  pip install PyQt5
             

  執行結果如下：

  

•  安裝PyQt5-tools：打開CMD或者PowerShell，在指令窗中輸入

  pip install PyQt5-tools
             

  執行結果如下：

  

 2.配置開發工具

        安裝完Qt Designer後，我們利用PyCharm進行界面開發，下面進行Qt開發工具的配置。

在PyCharm中依次打開：File→Settings 彈出Settings對話框，如下圖

 然後按下圖的4個步驟，打開Create Tools對話窗：

這裡需要配置兩個：

（1）配置QTDesigner，用來打開QT可視化開發工具

 如下圖，分别在Name、Program、Working dirctory填入如下資訊：

• Name：QTDesigner

• Program：D:\ProgramSoftware\Anaconda3\Lib\site-packages\pyqt5_tools\Qt\bin\designer.exe

                    注意：該路徑為你Python安裝路徑下Lib\site-packages\pyqt5_tools檔案夾裡

• Working dirctory：$FileDir$

  

（2）配置PyUIC，用來将Qt Designer開發工具生成的.ui檔案轉換為.py檔案

 如下圖，分别在Name、Program、Arguments、Working dirctory填入如下資訊：

• Name：PyUIC

• Program：D:\ProgramSoftware\Anaconda3\Scripts\pyuic5.exe

                    注意：該路徑為你Python安裝路徑下Scripts檔案夾裡

• Arguments：$FileName$ -o $FileNameWithoutExtension$.py
• Working dirctory：$FileDir$

  

  至此，安裝和配置過程全部結束，下面介紹簡單的使用教程。

 3.使用Qt Designer設計界面

•  在PyCharm中建立一個項目，然後點選“Tools”--“External Tools”--“QTDesinger”打開QT Desinger，如下圖：

•  在New Form對話框裡選擇Widget模闆，然後點選建立：

•  然後就會出現Qt Designer主界面，向Form中分别拖入一個“Push Button”和一個“Text Edit”，如下圖：

•  指定點選事件及其響應函數

  在工具欄點選 這個圖示 

  

   ，然後光标移動到“PushButton”按鈕上，滑鼠左鍵 點選 “PushButton”按鈕 不要松開，拖動光标 到 按鈕旁邊的任一位置後 再松開滑鼠左鍵

  

• 随後就出現了如下界面，在對話框左側選中“clicked()”，右側點選“Edit”

  

•  然後點選綠色“+”按鈕，指定click事件的響應函數，名稱随意，比如我這裡命名為“pushButton_click()”

  （我們這裡隻是指定事件與響應函數的關聯關系，函數是還沒實作的，後邊我們自行實作）

• 最後，将設計的界面儲存。

4.使用PyUIC将檔案轉成python代碼

       關閉QT Designer回到PyCharm，檢視項目，可以看到隻有剛才儲存的PyQT_Form.ui檔案而且該檔案在PyCharm是打不開的，我們需要将這個檔案轉成.py代碼才能使用。

• 選中“PyQT_Form”，在其上點選滑鼠右鍵，到“External Tools”中點選“PyUIC”

• 之後再看項目檔案，就可以看到多了一個“PyQT_Form.py”，輕按兩下檢視其内容如下：

 5.編寫邏輯代碼

       界面與業務邏輯分離實作：這一步主要實作業務邏輯，也就是點選登入和退出按鈕後程式要執行的操作。為了後續維護友善，采用界面與業務邏輯相分離來實作。也就是通過建立主程式調用界面檔案方式實作。這有2個好處：1.就是實作邏輯清晰。2.後續如果界面或者邏輯需要變更，好維護。建立一個.py檔案程式，在裡邊建立一個子類（MyPyQT_Form）繼承PyQT_Form.py中的Ui_Form。具體代碼如下：

import sys
from PyQt5 import QtWidgets
from PyQT_Form import Ui_Form

class MyPyQT_Form(QtWidgets.QWidget,Ui_Form):
    def __init__(self):
        super(MyPyQT_Form,self).__init__()
        self.setupUi(self)

    #實作pushButton_click()函數，textEdit是我們放上去的文本框的id
    def pushButton_click(self):
        self.textEdit.setText("你點選了按鈕")


if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    my_pyqt_form = MyPyQT_Form()
    my_pyqt_form.show()
    sys.exit(app.exec_())
           

6.運作

      至此，我們終于完成了第一個Python界面的設計，好累 (￣o￣) . z Z ，運作效果如下：

       覺得有用請留下你的贊 ^_^ 

參考資料：https://www.cnblogs.com/lsdb/p/9121903.html

                 https://www.cnblogs.com/lsdb/p/9122425.html

                 https://www.jb51.net/article/167015.htm