開啟Qt Designer.exe

加入兩個label和一個pushbutton

按下ctrl+r 預覽

按下儲存檔名test.ui

事先準備好Anaconda的image

在VSCode prompt呼叫yolov8 image設定

activate yolov8

activate yolov8

如果跳出下列錯誤訊息，表示VSCode在系統環境變數找不到anaconda的路徑

必須先加入系統環境變數3個，並 請將關鍵字me123置換成你的電腦使用者名稱

C:\Users\me123\anaconda3\

C:\Users\me123\anaconda3\Scripts

C:\Users\me123\anaconda3\Library\bin

按下確定加入系統環境變數後須重新開啟VSCode

pyuic5 -x test.ui -o test_ui.py

上面的指令會將原本qt designer設計的ui轉成python程式碼test_ui.py

滑鼠雙擊開啟test_ui.py並按下右上角執行按鈕

會自動執行該python應用程式如下

建立model

在model資料夾下新增m_sum.py，其中m_表示model

建立summation model

目前model資料夾下有m_sum.py

view資料夾下有test_ui.py

接著建立controller，在pyqt5資料夾下新增main.py

A:

固定加入PyQt5常用的模組

B 加入自訂義view和model模組

C 加入自訂義類別PyQt_Main(並繼承QMainWindow):

 加入__init__關鍵字後VSCode會自動補其餘的樣板，如下

A: 創立一個PyQt_Main類別的實體

B: 加入一個Ui_MainWindow類別的實體，該類別定義在view資料夾的test_ui.py檔案中

    該實體儲存在self.ui欄位

C: 先加入一個空的link事件的方法，爾後可以陸陸續續加入pushbutton點擊後觸發的方法註冊

D: 顯示介面

A: 註冊事件: 先自訂義一個doSummation方法，透過connect將pushButton點擊事件關聯至doSummation

B: doSummation中呼叫model/m_sum.py中的summation 方法

C: total執行summation(10)得到1+2+...+10的結果

D:更新view中label_2的顯示內容為加總結果

執行main.py得到1+2...+10得結果

'

如果想要加總1+2+...N可以修改model

for迴圈變成1+2+.....+(num+1)

因此若傳入100

可以得到5050

 最後將本範例資料儲存結構稍微整理如下

新增一個summation demo資料夾，並將view、model和main.py移入該資料夾內

打包成一個執行檔案

(yolov8) C:\python\pyqt5>pip install pyinstaller

(yolov8) C:\python\pyqt5\summation demo>pyinstaller main.py --onefile --noconsole

 參考資料:

PyQt 5 教學 II -- MVC設計概念

PyQt5 Tutorial - How to Use Qt Designer