Qt 6.2C++程序設(shè)計(jì)與桌面應(yīng)用開(kāi)發(fā) 思政課件 第4章 主框架窗口

Qt6.2/C++程序設(shè)計(jì)與桌面應(yīng)用開(kāi)發(fā)21世紀(jì)高等學(xué)校計(jì)算機(jī)類(lèi)課程創(chuàng)新規(guī)劃教材–微課視頻版教材目錄第1章初識(shí)Qt框架第2章Qt開(kāi)發(fā)基礎(chǔ)第3章界面設(shè)計(jì)組件第4章主框架窗口第5章對(duì)話框設(shè)計(jì)第6章事件系統(tǒng)第7章文件與數(shù)據(jù)庫(kù)第8章模型/視圖結(jié)構(gòu)第9章圖形繪制第10章多媒體編程第11章網(wǎng)絡(luò)編程第12章進(jìn)程與線程教材目錄第4章主框架窗口4.1框架結(jié)構(gòu)4.2菜單設(shè)計(jì)4.3工具欄設(shè)計(jì)4.4狀態(tài)欄設(shè)計(jì)4.5中心部件4.6錨接部件4.1框架結(jié)構(gòu)Qt應(yīng)用程序是一個(gè)基于C++程序設(shè)計(jì)語(yǔ)言的圖形用戶界面程序，它具有常見(jiàn)的窗口應(yīng)用程序的一般結(jié)構(gòu)。通常包括一個(gè)標(biāo)題欄、一個(gè)菜單欄、若干個(gè)工具欄、一個(gè)或多個(gè)工作窗口，以及狀態(tài)欄等部件。Qt應(yīng)用程序的主框架，即應(yīng)用程序的主窗口。所謂主窗口，就是一個(gè)普通意義上的應(yīng)用程序的最頂層窗口。4.1.1基本元素應(yīng)用程序的主窗口為建立應(yīng)用程序用戶界面提供了一個(gè)基礎(chǔ)框架，這個(gè)基礎(chǔ)框架一般包括標(biāo)題欄、菜單欄、工具欄和狀態(tài)欄等多個(gè)元素。在Qt中，應(yīng)用程序的主框架窗口由QMainWindow類(lèi)來(lái)實(shí)現(xiàn)，其布局如圖4.1所示。1、菜單欄菜單(Menu)是一系列命令的列表。為了實(shí)現(xiàn)菜單、工具欄按鈕、鍵盤(pán)快捷方式等命令的一致性，Qt使用Action(動(dòng)作)來(lái)表示這些命令。Qt的菜單就是由一系列的QAction類(lèi)的對(duì)象構(gòu)成的列表，而菜單欄(MenuBar)則是包容菜單的面板，它位于主窗口頂部的標(biāo)題欄下面。一個(gè)主窗口只能擁有一個(gè)菜單欄。2、工具欄工具欄(ToolBar)是由一系列的類(lèi)似于按鈕的Action

排列而成的面板，它通常由一些經(jīng)常使用的菜單命令組成。工具欄位于菜單欄的下面、狀態(tài)欄的上面，可以停靠在主窗口的上、下、左、右四個(gè)方向上。一個(gè)主窗口可以包含多個(gè)工具欄。3、錨接部件錨接部件(DockWidgets)作為一個(gè)容器使用，以包含其他窗口部件來(lái)實(shí)現(xiàn)某些功能。例如，QtDesigner界面設(shè)計(jì)器的屬性編輯器、對(duì)象監(jiān)視器等。錨接部件位于工具欄部件區(qū)域的內(nèi)部，可以作為一個(gè)窗口自由地浮動(dòng)在主窗口上面，也可以像工具欄一樣?？吭谥鞔翱诘纳?、下、左、右四個(gè)方向上。一個(gè)主窗口可以包含多個(gè)錨接部件。4、中心部件中心部件(CentralWidget)位于錨接部件區(qū)域的內(nèi)部、主窗口的中心，是應(yīng)用程序的主要功能的實(shí)現(xiàn)區(qū)域。一個(gè)主窗口只能擁有一個(gè)中心部件。5、狀態(tài)欄狀態(tài)欄通常用于顯示應(yīng)用程序的一些狀態(tài)信息，它位于主窗口的最底部。用戶可以在狀態(tài)欄上添加、使用Qt窗口部件。一個(gè)主窗口只能擁有一個(gè)狀態(tài)欄。4.1.2主窗口類(lèi)QMainWindow類(lèi)是Qt應(yīng)用程序的主窗口類(lèi)，該類(lèi)和其他一些相關(guān)的組件類(lèi)，例如QMenuBar、QToolBar、QDockWidget和QStatusBar等，共同對(duì)主窗口進(jìn)行管理。這些主框架窗口相關(guān)類(lèi)的繼承關(guān)系如圖4.2所示。4.2菜單設(shè)計(jì)在Qt中，菜單的設(shè)計(jì)有兩種方法，一種是使用QtDesigner工具的可視化方法，另一種是純代碼的編程方法。不管采用何種方法，都必須先熟悉與菜單相關(guān)的一些Qt類(lèi)，如QAction、Qmenu

和QMenuBar

等。4.2.1菜單相關(guān)類(lèi)1、QAction類(lèi)QAction類(lèi)用于創(chuàng)建具有一定功能的子菜單對(duì)象。從圖4.2可以看出，QAction類(lèi)是QObject類(lèi)的子類(lèi)，支持Qt元對(duì)象特性。下面是一段在Qt應(yīng)用程序主窗口中創(chuàng)建“文件”菜單的示例代碼：使用QAction類(lèi)的成員函數(shù)，可以創(chuàng)建菜單項(xiàng)、設(shè)置啟用/禁用特性、設(shè)置檢查特性、設(shè)置圖標(biāo)、設(shè)置快捷鍵等一系列操作。(1)設(shè)置菜單項(xiàng)的檢查特性(2)設(shè)置啟用/禁用特性(3)設(shè)置菜單項(xiàng)圖標(biāo)(4)設(shè)置菜單項(xiàng)的快捷鍵2、QMenu類(lèi)QMenu類(lèi)用于創(chuàng)建菜單對(duì)象，它繼承于QWidget類(lèi)，所以Qt中的菜單實(shí)際上是一個(gè)子窗口。對(duì)菜單的操作通過(guò)QMenu類(lèi)的成員函數(shù)來(lái)完成。(1)創(chuàng)建菜單(2)添加菜單項(xiàng)可以調(diào)用QMenu類(lèi)的addAction()方法為菜單添加菜單項(xiàng)(Action)。(3)添加子菜單可以調(diào)用QMenu類(lèi)的addMenu()方法為菜單添加子菜單。例如：helpMenu->addMenu(options);(4)添加菜單分隔線可以調(diào)用QMenu類(lèi)的addSeparator()方法為菜單添加分隔線。例如：helpMenu->addSeparator();菜單分隔線是菜單中的灰色直線，它將菜單項(xiàng)按功能進(jìn)行分區(qū)。3、QMenuBar類(lèi)QMenuBar類(lèi)對(duì)象用于表示菜單欄。它繼承自QWidget類(lèi)，所以菜單欄實(shí)際上就是一個(gè)包容菜單的小窗體。對(duì)菜單欄的操作通過(guò)QMenuBar類(lèi)的成員函數(shù)來(lái)完成。4.2.2可視化設(shè)計(jì)在Qt應(yīng)用開(kāi)發(fā)過(guò)程中，可以使用可視化或手工編寫(xiě)代碼這兩種方式來(lái)進(jìn)行菜單的設(shè)計(jì)。采用可視化方式設(shè)計(jì)菜單，需要使用QtDesigner界面設(shè)計(jì)工具，來(lái)完成菜單的編輯、Action的創(chuàng)建，以及信號(hào)與槽的關(guān)聯(lián)等工作。下面通過(guò)一個(gè)實(shí)例來(lái)介紹菜單的可視化設(shè)計(jì)方法?！纠?.1】編寫(xiě)一個(gè)Qt應(yīng)用程序，并為其添加“文件”“編輯”等主菜單及子菜單。(1)打開(kāi)QtCreator集成開(kāi)發(fā)環(huán)境，創(chuàng)建一個(gè)基于QMainWindow類(lèi)的Qt應(yīng)用程序。項(xiàng)目名稱為examp4_1(2)雙擊項(xiàng)目視圖中的mainwindow.ui界面文件，打開(kāi)Qt界面設(shè)計(jì)器，對(duì)應(yīng)用程序主窗口界面進(jìn)行設(shè)計(jì)。如圖4.11所示。(3)雙擊菜單欄中的“Typehere”，為應(yīng)用程序設(shè)置主菜單，分別為：文件、編輯、格式、查看和幫助(4)添加菜單圖標(biāo)資源。就像QtCreator的主菜單一樣，在某些菜單項(xiàng)的前面需要設(shè)置一個(gè)小的圖標(biāo)，當(dāng)把該菜單命令放置在工具欄上時(shí)，工具欄會(huì)用該圖標(biāo)表示此菜單命令。菜單的圖標(biāo)資源一般存放在項(xiàng)目的資源文件中，所以需要為項(xiàng)目添加一個(gè)Qt的資源文件(res.qrc)(5)新建動(dòng)作(Action)對(duì)象。Qt有菜單類(lèi)QMenu，但沒(méi)有專門(mén)的菜單項(xiàng)類(lèi)，它的菜單項(xiàng)是用動(dòng)作類(lèi)QAction對(duì)象來(lái)表示的。(6)將創(chuàng)建好的動(dòng)作對(duì)象用鼠標(biāo)拖放到相應(yīng)的主菜單中，完成菜單界面的創(chuàng)建。如圖4.16所示。(7)為菜單項(xiàng)添加處理函數(shù)。(8)構(gòu)建并運(yùn)行程序。選擇“文件｜新建”菜單命令，結(jié)果如圖4.18所示。4.2.3純代碼設(shè)計(jì)使用可視化方法設(shè)計(jì)菜單，可以大大提高設(shè)計(jì)效率，但有時(shí)會(huì)顯得不夠靈活。下面通過(guò)手工編程的方式來(lái)完成例4.1中程序菜單的設(shè)計(jì)。4.2.3純代碼設(shè)計(jì)【例4.2】手工編寫(xiě)程序代碼，完成例4.1中程序的菜單設(shè)計(jì)。(1)打開(kāi)QtCreator集成開(kāi)發(fā)環(huán)境，創(chuàng)建一個(gè)基于QMainWindow類(lèi)的Qt應(yīng)用程序，項(xiàng)目名稱為examp4_2在“ClassInformation”對(duì)話框中不勾選“Generateform”選項(xiàng)。(2)向項(xiàng)目中添加圖標(biāo)資源。操作方法如例4.1的第(4)步所示。(3)打開(kāi)mainwindow.h文件，給MainWindow類(lèi)添加一些QMenu

和QAction

類(lèi)型的私有成員變量指針，分別用來(lái)表示應(yīng)用程序的主菜單對(duì)象和Action對(duì)象。代碼如下。繼續(xù)添加代碼，為MainWindow類(lèi)添加2個(gè)成員函數(shù)createActions()和createMenus()，用于創(chuàng)建Action和菜單對(duì)象。代碼如下。(4)打開(kāi)mainwindow.cpp文件，編寫(xiě)成員函數(shù)createActions()和createMenus()的實(shí)現(xiàn)代碼。(5)在MainWindow類(lèi)的構(gòu)造函數(shù)中添加代碼，對(duì)程序主窗口進(jìn)行初始化。(6)為newFileAction動(dòng)作編寫(xiě)槽函數(shù)，并添加測(cè)試代碼。4.3工具欄設(shè)計(jì)工具欄(ToolBar)是由一系列的類(lèi)似于按鈕的Action排列而成的面板，它通常由一些經(jīng)常使用的菜單命令組成。Qt應(yīng)用程序的工具欄實(shí)際上就是一個(gè)包含了動(dòng)作項(xiàng)、工具欄按鈕或其他控件的可以移動(dòng)的面板。一個(gè)Qt應(yīng)用程序可以有多個(gè)工具欄。4.3.1工具欄相關(guān)類(lèi)1、QToolBar類(lèi)QToolBar類(lèi)表示Qt應(yīng)用程序的工具欄?？梢允褂肣ToolBar類(lèi)的成員函數(shù)實(shí)現(xiàn)工具欄按鈕的添加、?？刻匦缘脑O(shè)置、移動(dòng)特性的設(shè)置等操作。下面是一段示例代碼：在上述示例代碼中，使用了Qt::ToolBarArea枚舉類(lèi)型常量，它表示了工具欄的?？课恢谩９ぞ邫谏习粹o的顯示方式由Qt::ToolButtonStyle枚舉類(lèi)型的常量來(lái)設(shè)置，如下表所示。2、QToolButton類(lèi)在前面的示例代碼中，工具欄上的按鈕都是QAction對(duì)象。在工具欄中除了Action之外，還可以添加其他的窗口部件，例如QLabel、QFontComboBox等。向工具欄中添加一個(gè)QAction類(lèi)對(duì)象會(huì)自動(dòng)創(chuàng)建一個(gè)QToolButton實(shí)例，工具欄上的Action實(shí)際上是QToolButton對(duì)象。下面是一段示例代碼:4.3.2可視化設(shè)計(jì)與菜單設(shè)計(jì)方法相同，工具欄的設(shè)計(jì)也可以使用可視化方法或手工編寫(xiě)代碼的方法。采用可視化方式設(shè)計(jì)工具欄，需要使用QtDesigner界面設(shè)計(jì)工具完成工具欄的編輯、Action的創(chuàng)建、按鈕的添加等相關(guān)工作?！纠?.3】在例4.1程序的主窗口中添加一個(gè)工具欄，并設(shè)置工具欄按鈕。(1)復(fù)制例4.1中的examp4_1項(xiàng)目，將其項(xiàng)目名稱修改為examp4_3。(2)在QtCreator中打開(kāi)examp4_3項(xiàng)目，啟動(dòng)Qt設(shè)計(jì)器。在對(duì)象視瀏覽器中右擊MainWindow對(duì)象，選擇快捷菜單中的“AddToolBar”菜單命令，向主窗口中添加一個(gè)工具欄。(3)將“動(dòng)作編輯器”列表中的相應(yīng)Action直接拖放到工具欄上，即可實(shí)現(xiàn)應(yīng)用程序的工具欄功能。如圖4.23所示。(4)構(gòu)建并運(yùn)行程序。程序運(yùn)行后，用鼠標(biāo)按住工具欄的最左側(cè)，可以將工具欄停放在主窗口的左、右或下方等不同的位置。(5)將鼠標(biāo)移動(dòng)到工具欄最左邊的按鈕上，在鼠標(biāo)位置會(huì)出現(xiàn)“新建”提示信息；單擊該按鈕，會(huì)彈出一個(gè)消息框。如圖4.24所示。4.3.3純代碼設(shè)計(jì)采用可視化方法設(shè)計(jì)應(yīng)用程序的工具欄，雖然簡(jiǎn)單快捷，但也存在諸多缺陷。例如，圖4.21中實(shí)現(xiàn)的工具按鈕菜單、字體選擇組合框等部件功能，就不能通過(guò)可視化方法來(lái)實(shí)現(xiàn)。在工具欄中添加除Action之外的其他部件，必須使用編寫(xiě)代碼的設(shè)計(jì)方法?！纠?.4】編寫(xiě)代碼，實(shí)現(xiàn)例4.3中應(yīng)用程序主窗口中的工具欄。(1)復(fù)制例4.2中的examp4_2項(xiàng)目，將其項(xiàng)目名稱修改為examp4_4。(2)在QtCreator中打開(kāi)examp4_4項(xiàng)目，在mainwindow.h文件中添加如下代碼。(3)在mainwindow.cpp文件中添加成員函數(shù)createToolBar()的實(shí)現(xiàn)代碼，并在MainWindow類(lèi)的構(gòu)造函數(shù)中調(diào)用該函數(shù)。如下所示。(4)構(gòu)建并運(yùn)行程序。4.4狀態(tài)欄設(shè)計(jì)QMainWindow主窗口中默認(rèn)提供了一個(gè)狀態(tài)欄，用來(lái)顯示狀態(tài)信息。狀態(tài)信息分為3種類(lèi)型，即臨時(shí)信息、正常信息和永久信息。一般的提示信息(如菜單的狀態(tài)欄提示信息)屬于臨時(shí)信息。目前的QtDesigner界面設(shè)計(jì)器不支持狀態(tài)欄的可視化設(shè)計(jì)，狀態(tài)欄上的信息顯示需要使用手工編碼的方式來(lái)完成。4.4.1QStatusBar類(lèi)與菜單欄和工具欄一樣，主框架窗口中的狀態(tài)欄也是一個(gè)子窗口，它由QStatusBar類(lèi)負(fù)責(zé)管理與維護(hù)。下面是一段示例代碼：臨時(shí)信息永久信息4.4.2設(shè)計(jì)實(shí)例由于QMainWindow主框架窗口默認(rèn)提供狀態(tài)欄，所以在Qt應(yīng)用程序中使用狀態(tài)欄顯示信息相對(duì)容易，編程過(guò)程中只需要熟練使用QStatusBar類(lèi)的成員函數(shù)即可。下面給出一個(gè)較為完整的應(yīng)用實(shí)例?！纠?.5】在例4.3程序的狀態(tài)欄上顯示臨時(shí)信息“清華大學(xué)出版社”，以及永久信息“Qt6/C++程序設(shè)計(jì)與桌面應(yīng)用開(kāi)發(fā)–馬石安”。如圖4.26所示。要求臨時(shí)信息顯示5秒后自動(dòng)消失。(1)復(fù)制例4.3中的examp4_3項(xiàng)目，將其項(xiàng)目名稱修改為examp4_5。(2)在QtCreator中打開(kāi)examp4_5項(xiàng)目，在mainwindow.h文件中添加如下代碼?！璸rivate:voidsetStatusMessage();…(3)在mainwindow.cpp文件中添加成員函數(shù)setStatusMessage()的實(shí)現(xiàn)代碼，并在MainWindow類(lèi)的構(gòu)造函數(shù)中調(diào)用該函數(shù)。(4)構(gòu)建并運(yùn)行程序。4.5中心部件在主窗口的中心區(qū)域可以放置一個(gè)中心部件，它一般是一個(gè)編輯器或?yàn)g覽器。中心部件的設(shè)置非常簡(jiǎn)單，只需要調(diào)用QMainWindow類(lèi)的setCentralWidget()函數(shù)，將構(gòu)造好的部件對(duì)象添加進(jìn)去就可以了。在Qt應(yīng)用程序中，主窗口的中心部件一般都為Qt的瀏覽類(lèi)型組件，包括QListView、QTreeView、QTableView、QListWidget、QTreeWidget

和QTableWidget

等。下面以QTextEdit組件為例，簡(jiǎn)單介紹Qt主窗口中心部件的使用方法?！纠?.6】在例4.5項(xiàng)目的中心區(qū)域設(shè)置一個(gè)QTextEdit文本編輯器組件，并實(shí)現(xiàn)文本編輯功能中的“復(fù)制”“粘貼”“剪切”“撤銷(xiāo)”等功能。(1)復(fù)制例4.5中的examp4_5項(xiàng)目，將其項(xiàng)目名稱修改為examp4_6。(2)在QtCreator中打開(kāi)examp4_6項(xiàng)目，雙擊mainwindow.ui界面文件啟動(dòng)QtDesigner設(shè)計(jì)器，在中心區(qū)域添加一個(gè)名為textEdit的QTextEdit對(duì)象。如圖4.28所示。(3)實(shí)現(xiàn)“編輯”|“復(fù)制”菜單命令功能。右擊圖4.28中下部“ActionEditor”窗口中的“復(fù)制”菜單命令，在彈出的快捷菜單中選擇“Gotoslot…”菜單命令，如圖4.29所示。在接下來(lái)的對(duì)話框中選擇“triggered()”信號(hào)，如圖4.30所示。在“復(fù)制”菜單的槽函數(shù)中添加代碼，實(shí)現(xiàn)文本復(fù)制功能。voidMainWindow::on_action_copy_triggered(){ui->textEdit->copy();}(4)用同樣的方法實(shí)現(xiàn)“編輯”菜單的“粘貼”“剪切”“撤銷(xiāo)”等功能。(5)構(gòu)建并運(yùn)行程序。4.6錨接