Python建立圖形使用者介面的神兵利器-PyQt5

2018-06-23

48373
0
Python
2018-09-18

受夠了Tkinter的簡陋難用嗎？

本文以 PyQt 套件嘗試實作視窗應用程式，

提供你以Python建立圖形使用者介面的另外一種選擇。

在ASP.NET的Windows Form中，控制項一拉一拖，就可以拉出GUI，換到Python世界以後，都是以小黑窗執行，並不需要考慮介面的部分，在一次執行專案過程中，前輩要求需要有介面(畢竟專案成果是要Demo的，總不能開小黑窗吧！)，當時是用Tkinter做出來的，但真心覺得難用orz(各種撞頭，頭破血流)

Layut部分不但要算格子，能用的控制項(借Windows Form的名詞)還少得可憐

再加上邏輯功能的部分，太棒了，全部混在一起！！！！！

最後是有做出來啦！但總覺得差強人意，記得當初~~年輕不懂事~~在ASP.NET寫出視窗程式時，很有成就感，如今寫起Python也想說試試看寫幾個視窗應用程式

作業系統：Windows 10

Python版本：Python 3.6

使用套件：pyqt5 5.10.1、pyqt5-tools 5.9.0.1.2

關於pyqt5，在5.7版本以前，只要安裝pyqt5就包含designer的設計工具，但在5.7版本以後，作者將designer的設計工具移除了，所以加裝pyqt5-tools，但不保證pyqt5-tools跟得上最新版本的pyqt5！

詳情請看 https://stackoverflow.com/questions/42090739/pyqt5-how-to-start-the-designer

1.安裝

在CMD裡用pip指令安裝pyqt5、pyqt5-tools套件
pip install pyqt5
pip install pyqt5-tools

2.使用designer.exe設計你的介面

designer.exe的位置請參考 C:\Users\[username]\AppData\Local\Programs\Python\Python36-32\Lib\site-packages\pyqt5-tools\designer.exe
在開啟designer的時候會先跳出一個對話框，這是在選擇模板，你可以根據你的需求做不同選擇，詳細情形可參考官方網站，在這裡我選擇Widget，按下create後就可以開始拉你的介面啦！
可以看到右邊有一個property editor視窗，可以讓你直接修屬性，跟ASP.NET的windows form是不是很像呢！
這邊我就先拉一個按鈕和輸入框，不免俗地來一下Hello World XDDD
記住按鈕與輸入框的objectName：pushButton、label，這將當作唯一識別的ID
設計完後就可存檔了
designer.exe會存成.ui的檔案，這裡我命名為MyFirstUI

3.將.ui檔案轉成.py檔案

在CMD裡用cd指令切換到存檔的資料夾位置然後用pyuic5 指令來轉換成.py檔案
pyuic5 MyFirstUI.ui > MyFirstUI.py
每更新一次設計，就要執行一次

4.執行，呈現你設計的畫面

在同一個資料夾底下新增一個app.py檔案，python code如下

import sys
from PyQt5.QtWidgets import QDialog, QApplication
from MyFirstUI import Ui_Form    #MyFirstUI 是你的.py檔案名字

class AppWindow(QDialog):
    def __init__(self):
        super().__init__()
        self.ui = Ui_Form()
        self.ui.setupUi(self)
        self.show()

app = QApplication(sys.argv)
w = AppWindow()
w.show()
sys.exit(app.exec_())

執行後就可以看到妳的圖形化介面了

5.撰寫功能

這裡請注意一點，那就是無論如何也不要把code寫在.ui檔案轉成的.py檔案裡(這邊的例子就是MyFirstUI.py)，因為你的畫面設計可能會時常更動，只要再執行一次pyuic5指令，那你的檔案就會被蓋掉，你寫的code自然也不見了！
打開剛剛新增的app.py檔案並修改成以下code

import sys
from PyQt5.QtWidgets import QDialog, QApplication
from MyFirstUI import Ui_Form      #MyFirstUI 是你的.py檔案名字

class AppWindow(QDialog):
    def __init__(self):
        super().__init__()
        self.ui = Ui_Form()
        self.ui.setupUi(self)

       #綁上與點擊事件對應的function，所有東西都在ui底下！！
        self.ui.pushButton.clicked.connect(self.pushButton_Click)
        self.show()

    def pushButton_Click(self):
        self.ui.label.setText("Hello World")

app = QApplication(sys.argv)
w = AppWindow()
w.show()
sys.exit(app.exec_())

按下點擊紐就可以看到"Hello World"了

回首頁

絕學集

繼往聖之絕學