Python深度學習實戰PyQt5菜單和工具欄功能作用

Posted on by

1. 創建主窗口

上文中我們建立的圖形界面程序 GUIdemo2.py，通過導入圖形界面 uiDemo1.py，已經實現瞭主窗口的創建。

1.1 窗口類型

進一步地，在 QtDesigner 創建主窗口有三種類型：QMainWindow、QDialog 和 QWidget。

QMainWindow：包括菜單欄、工具欄、狀態欄和標題欄，常用於應用程序的窗口。

QDialog：沒有菜單欄、工具欄、標題欄，常用於對話框的窗口。QtDesigner 中進一步提供瞭：沒有默認按鈕的對話框、底部按鈕的對話框和右側按鈕的對話框可供選擇。

QWidget：不確定窗口的類型。

新建應用程序窗口，通常可以選擇 MainWindow 創建主窗口的圖形界面。QtDesigner 創建的 “MainWindow” 雖然是一個空白的圖形窗口，但已經生成瞭 centralwidget、menubar、statusbar 三個基本控件，可以在右側上方 “對象查看器” 查看這些控件及結構。

1.2 編輯窗口的屬性

在 QtDesigner 中用鼠標選中主窗口，或者在右側的 “對象查看器” 中選中對象 “MainWindow”，此時右側中部的 “屬性編輯器” 將顯示對象 “MainWindow” 的屬性。在 “屬性編輯器” 內可以對對象的屬性進行編輯和修改。

  • 對象名稱（objectName）

當前窗口對象的名稱（objectName）默認為 “MainWindow”。對象名稱可以修改，但小白不要輕易去修改。在生成的 .ui 文件和 .py 文件中將定義一個類 Ui_MainWindow，在主程序調用圖形界面時也會實例化類。

如果修改瞭對象名稱，則主程序中需要進行相應修改。一些例程中定義類 Ui_Form，就是將窗口對象名稱設為 “Form”。

  • 窗口標題（windowTitle）

當前窗口對象的標題（windowTitle）默認值也是 “MainWindow”，因此容易將其與對象名稱（objectName）混淆。

窗口標題顯示在應用程序窗口的左上角，通常是程序名。窗口對象的標題是可以根據需要修改的，本例修改為 “數字圖像處理”。

  • 應用圖標（windowIcon）

當前窗口對象的圖標（windowIcon）默認值 Null，沒有圖標。
– 點擊 “屬性編輯器” 下 windowIcon 行的右側空白處，將出現 ” [Theme]”、”…” 和 “ ▽ \triangledown ▽” 按鈕的選項框
– 點擊 “ ▽ \triangledown ▽” 按鈕，從 “選擇資源”、“選擇文件”、“選擇主題” 三個選項選中 “選擇文件”，從文件夾中選擇一個圖標文件。
本例在 Python 當前 Project 路徑下建立瞭 \image 目錄，圖標和圖片文件都保存在 \image 目錄。本例選擇 youcans.png 作為應用程序圖標，讀者可以任選自己的圖標文件。

在 “屬性編輯器” 內也可以對其它對象屬性進行編輯和修改，例如：

  • 將 MainWindow 對象的高度修改為 800，寬度修改為 600；

1.3 圖形界面設計的預覽

在 QtDesigner 菜單中選擇：窗體 -> 預覽，就可以預覽設計的圖形界面，還可以選擇預覽不同操作系統的顯示效果。這使我們不需要編寫主程序就可以預覽圖形界面的顯示效果，以便進行修改。

剛才所創建的應用程序窗口預覽如下圖所示：

在這裡插入圖片描述

2. 建立菜單欄

2.1 建立一級菜單

QtDesigner 創建的 “MainWindow” 圖形窗口，自動生成瞭頂部菜單欄 menubar，在圖形窗口左上角顯示有文本輸入框 “在這裡輸入”。

輸入菜單對象（menu）的標題（title）：

  • 鼠標點擊文本輸入框 “在這裡輸入”，選中文本輸入框，控件的邊框變為紫色；
  • 再雙擊選中的控件，出現激活的文本輸入框，就可以輸入所要建立菜單的標題；
  • 輸入菜單標題後回車結束，就建立瞭一個一級菜單，例如：將菜單標題設為 “文件”。

輸入菜單對象的標題，以及修改菜單對象的屬性，更通用的方法是：

  • 在 QtDesigner 右側的 “對象查看器” 中選中對象 “menu”，此時右側中部的 “屬性編輯器” 將顯示對象 “menu” 的屬性。
  • 在 “屬性編輯器” 內選擇 “title” 屬性，將其修改為菜單標題：“文件”。

建立一級菜單 “文件” 後，菜單欄中在 “文件” 右側又出現新的文本輸入框 “在這裡輸入” ，按照以上操作可以接著建立更多的菜單對象。
本例中還建立瞭一個一級菜單對象 “menuQuit”，標題為 “退出”。

2.2 建立二級菜單

QtDesigner 創建二級菜單，實際上是將動作（action）添加到一級菜單。

  • 鼠標點擊一級菜單對象 “文件”，出現兩個下拉菜單選項：“在這裡輸入” 和 “添加分割符”。
  • 選中 “在這裡輸入”，輸入二級菜單的標題。
    我們發現這時文本輸入框不接受中文輸入，於是輸入英文 “Open”，生成二級菜單項。觀察 QtDesigner 右側的 “對象查看器”，在 menubar-menu 下新建的並不是控件對象，而是動作 actionOpen。這就是剛才文本輸入框不接受中文的原因。
  • 編輯動作 actionOpen 的屬性，可以將屬性 “text” 由 “Open” 修改為中文 “打開”。這時再點擊菜單 “文件”，下拉菜單中的動作 actionOpen 就顯示為中文 “打開”。類似地，在一級菜單對象 “文件” 下，再建立兩個二級菜單（動作）“Save”、“Close”，並將其屬性 “text” 修改為 “保存”、“關閉”。
  • 點擊二級菜單/動作 “打開”，在其右側有個 “+” 按鈕，點擊後可以創建新的下一級菜單。
    註意：這時剛才建立的動作對象 “menu-actionOpen” 被自動刪除瞭，同時生成瞭一個菜單對象 “menu-menu_2”。這是因為隻有最下級的菜單項被設為動作對象 “QAction”，而上級菜單項隻能是菜單對象 “QMenu”。

本例還在一級菜單對象 “menuQuit” 下建立瞭動作對象 “actionQuit”，標題為 “Quit”。

預覽一下應用程序窗口，就可以看到剛才建立的菜單欄：

在這裡插入圖片描述

2.3 關聯動作

我們已經在圖形界面建立瞭菜單項，並為菜單項添加瞭動作對象。但是動作對象中的 “打開”、“保存”、“關閉” 隻是這些動作對象的名稱和描述，並沒有定義或關聯具體的動作。

因此在點擊菜單時，雖然會顯示對應的菜單選項，但並不會真正進行 “打開”、“關閉” 的動作。下面以一級菜單 “退出” 下的動作對象 “actionQuit” 為例，講解將關閉動作（close）關聯到動作對象 “actionQuit” 。

這裡要簡單解釋一下 PyQt5 中的信號與槽機制。信號與槽是 PyQt5 中對象之間進行通信的機制。簡單地說，對某個信號與某個槽函數進行連接之後，當該信號被觸發時，自動執行對應的槽函數。

因此，將一個動作關聯到一個動作對象（或其它對象），就是定義瞭對象的動作（例如點擊菜單項）作為信號，並連接到對應的動作處理函數。當該信號被觸發時，將自動執行對應的槽函數（動作處理函數）。例如，將點擊動作對象 “actionQuit” 作為信號，連接到動作處理類 close()，則在該對象被點擊時就會自動執行類 close()，進而執行 QDialog 類中的closeEvent() 方法。

將動作函數 close() 關聯到動作對象 “actionQuit” 的操作如下：

  • 從在 QtDesigner 右側下方窗口 “信號/槽編輯器”，點擊綠色的 “+” 新建一個信號/槽連接；
  • 點擊 “<發送者>”，從菜單中選擇對象 “actionQuit”；
  • 點擊 “<信號>”，從菜單中選擇 “triggered()”；
  • 點擊 “<接收者>”，從菜單中選擇 “MainWindow”；
  • 點擊 “<槽>”，從菜單中選擇 “closed()”。

以上操作的作用是：發送者 對象 “actionQuit” 觸發 “triggered()” 時，接收者 對象”MainWindow” 執行槽函數 “closed()”。

QtDesigner 中 “信號/槽編輯器” 的使用確實比較繁瑣，特別是對於菜單欄和工具欄的支持並不友好，而且不支持一級菜單對象直接連接槽函數。

相比而言，對於菜單欄和工具欄，在主程序中通過 connect() 建立信號/槽連接則更加簡便：

self.actionQuit.triggered.connect(MainWindow.close)

3. 建立工具欄

工具欄/工具條是圖形界面中的常用組件，將一組按鈕控件排成一行放在圖形窗口的頂部。

3.1 添加工具欄

QtDesigner 中 添加工具欄的操作很簡單，但是不太好找：

  • 單擊鼠標右鍵，選擇 “添加工具欄”。
  • 也可以選擇 “Add Toolbar to Other Area”，將工具欄添加到窗口的左側、右側或底部。

添加工具欄以後，在頂部菜單欄的下方出現工具欄。新添加的工具欄是空的，非常窄，不加註意就容易被忽略。

3.2 添加和編輯動作對象

工具欄中隻能添加動作控件（QAction），因此要先添加/編輯動作。

其實上文中菜單欄中也隻能添加動作控件，但是菜單欄允許在輸入二級菜單時直接添加動作控件（QAction），而工具欄隻允許選擇已有的動作控件添加。

在 QtDesigner 右側下方窗口選擇 “動作編輯器”，可以新建或編輯動作對象。

在 1.2 建立二級菜單時，我們已經建立瞭 actionOpen、actionSave、actionClosr、actionQuit等動作對象。這些動作對象顯示在 “動作編輯器” 子窗口中。

添加/編輯動作對象步驟為：

  • 點擊 “動作編輯器” 子窗口工具欄的第一個圖標按鈕 “新建”，則彈出 “新建動作” 對話框；
  • 雙擊 “動作編輯器” 中的動作對象，則彈出 “編輯動作” 對話框，可以編輯已有動作對象的屬性；

“新建動作” 與 “編輯動作” 對話框的結構是相同的，對照已有動作對象的屬性更容易理解 “新建動作” 對話框中屬性選項的含義：

  • “文本” 指動作的標題，是控件的顯示內容，可以是中文或英文，例如 “打開(Open)”；
  • “對象名稱” 指動作的名稱，是程序中調用對象的名稱，隻能是英文，例如 “actionOpen”；
  • “圖標” 指工具欄中所顯示的動作圖標，點擊 “ ▽ \triangledown ▽” 按鈕，選擇 “選擇文件” 選項，可以從文件夾中選擇圖標文件。

本例添加瞭動作對象：“actionSetup/設置”、“actionHelp/幫助”，並編輯動作對象 “actionQuit/退出” 設置動作圖標。

3.3 向工具欄添加動作對象

從 QtDesigner 右側下方窗口選擇 “動作編輯器”，鼠標左鍵點擊選中其中的動作控件，長按鼠標不放，拖動到圖形窗口的工具欄後松開，就將動作控件添加到工具欄中。

如果動作對象設有圖標，則在工具欄顯示動作圖標；如果動作對象沒有設置圖標，則在工具欄顯示動作標題的文本信息。

本例將 “動作編輯器” 中的 6個動作對象都添加到工具欄。

預覽一下應用程序窗口，就可以看到剛才建立的工具欄。

該窗口的工具欄中 “打開”、“保存”、“關閉” 三個動作對象顯示為文字，而 “設置”、“幫助”、“退出” 三個動作對象顯示為圖標，顯得不倫不類，這主要是為瞭示范不同的顯示選項。隨後我們會進行修改，為 “打開”、“保存”、“關閉” 等動作對象添加圖標。

在這裡插入圖片描述

4. 編寫 Python 應用程序調用圖形界面

為 “打開”、“保存”、“關閉” 等動作對象添加圖標，在 QtDesigner 將設計的圖形界面保存為 uiDemo3.ui。

在 PyCharm 選中 uiDemo3.ui 文件，點擊鼠標右鍵喚出下拉菜單，選擇：ExternalTools -> PyUIC，點擊鼠標左鍵運行 PyUIC 將選中的 .ui 文件轉換為 .py 文件，在該路徑生成 uiDemo3.py 文件。

我們編寫一個主程序調用設計的圖形界面 uiDemo3.py，就可以完成一個圖形界面應用程序。

# GUIdemo3.py
# Demo3 of GUI by PyQt5
# Copyright 2021 youcans, XUPT
# Crated：2021-10-08
from PyQt5.QtWidgets import QApplication, QMainWindow
import sys
import uiDemo3  # 導入圖像界面設計文件
if __name__ == '__main__':
    app = QApplication(sys.argv)  # 創建應用程序對象
    MainWindow = QMainWindow()  # 創建主窗口
    ui = uiDemo3.Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()  # 顯示主窗口
    sys.exit(app.exec_())  # 在主線程中退出

在主程序 GUIdemo3.py 中，我們通過 “import uiDemo3” 導入瞭 圖形界面 uiDemo3.py。

運行程序 GUIdemo3，彈出的圖形界面與 3.3 中的預覽效果是一致的，隻是添加圖標後的動作對象 “打開”、“保存”、“關閉” 在工具欄已經顯示為圖標。

在這裡插入圖片描述

GUIdemo3 中隻有 “退出” 按鈕和菜單項有效，點擊後退出應用程序。其它按鈕和菜單項還是無效的。這是因為我們還沒有為這些控件關聯動作程序（連接槽函數）。我們將在下一節學習信號與槽函數的連接。

 傳送門：Python深度學習實戰PyQt5信號與槽的連接

以上就是Python深度學習實戰PyQt5菜單和工具欄功能作用的詳細內容，更多關於PyQt5學習的資料請關註WalkonNet其它相關文章！

推薦閱讀：