PyQt是Qt界面庫(kù)在Python下的綁定，為在Python語(yǔ)言下編寫(xiě)GUI界面程序提供了極大的便利。對(duì)于界面程序的設(shè)計(jì)，可以使用代碼構(gòu)建，也可以借助于其提供的設(shè)計(jì)師（Qt Designer）工具來(lái)構(gòu)建。

下面給出一個(gè)在Python語(yǔ)言中使用PyQt界面庫(kù)及設(shè)計(jì)師工具編寫(xiě)界面程序的入門例子。

例子說(shuō)明

該例運(yùn)行界面如下圖所示，包括了常用軟件界面必備的幾個(gè)區(qū)域部分：菜單欄、工具欄、狀態(tài)欄及主窗口顯示區(qū)域，其中，主窗口顯示區(qū)域使用水平及垂直分割條控件以左一右二的形式分為了三個(gè)窗口部分。

工具欄的顯示樣式可通過(guò)菜單設(shè)置為”僅顯示圖標(biāo)”或”顯示圖標(biāo)和文字”兩種樣式。另外，通過(guò)點(diǎn)擊工具欄上窗口視圖的下拉菜單可設(shè)置右面兩個(gè)窗口的顯示或隱藏狀態(tài)。

下面看下怎么在設(shè)計(jì)師（Qt Designer）中來(lái)實(shí)現(xiàn)這個(gè)界面程序的設(shè)計(jì)。

前提條件

假定你使用的IDE是PyCharm，并且已經(jīng)配置了如下圖所示三個(gè)常用工具：

具體的配置方法可參考前面的文章：

這三個(gè)常用工具都可以在PyCharm的右鍵菜單中操作，功能簡(jiǎn)要說(shuō)明如下：

Qt Designer：可以在PyCharm中開(kāi)發(fā)環(huán)境中快速打開(kāi)設(shè)計(jì)師（Qt Designer）工具。

PyUIC：將Qt Designer設(shè)計(jì)的”.ui”界面文件轉(zhuǎn)換成”.py”文件。

Rcc2Py：將Qt Designer設(shè)計(jì)中用到的資源文件”.qrc”文件轉(zhuǎn)換成”.py”文件。

軟件界面使用設(shè)計(jì)師（Qt Designer）工具的設(shè)計(jì)過(guò)程

1、新建UI文件

打開(kāi)設(shè)計(jì)師，新建一個(gè)窗體，模板選擇為Main Window，如下圖所示，并保存為”Main.ui”文件：

2、新建資源文件

在設(shè)計(jì)師的資源瀏覽器中新建一個(gè)資源文件保存名稱為”MyRes.qrc”，將本例界面中用到的圖標(biāo)等資源文件添加到該文件中，如下圖所示（前綴設(shè)置為空，圖標(biāo)文件保存在當(dāng)前程序所在目錄的img子文件夾下）：

3、在動(dòng)作編輯器編輯各種action

菜單欄、工具欄上的大部分功能都可以通過(guò)動(dòng)作編輯器完成，可以設(shè)置每個(gè)action的名稱、文本、快捷鍵、是否可選、工具提示等信息，本例中動(dòng)作編輯完成后如下圖所示：

4、菜單欄設(shè)計(jì)

通過(guò)拖放前面創(chuàng)建的action，可在設(shè)計(jì)師中完成菜單欄的設(shè)計(jì)，對(duì)于本例，設(shè)計(jì)完成后文件、選項(xiàng)-工具欄樣式及選項(xiàng)-窗口視圖菜單項(xiàng)分別如下圖所示：

5、工具欄設(shè)計(jì)

同菜單欄設(shè)計(jì)過(guò)程類似通過(guò)拖放前面創(chuàng)建的action完成工具欄的設(shè)計(jì)，本例中工具欄編輯完成后如下圖所示：

需要說(shuō)明的是，本例工具欄還包括一個(gè)帶下拉菜單的QToolButton控件，在設(shè)計(jì)師中不能直接將其放到工具欄區(qū)域中，后面需在代碼中手動(dòng)創(chuàng)建該控件。

6、狀態(tài)欄設(shè)計(jì)

本例狀態(tài)欄比較簡(jiǎn)單，只在狀態(tài)欄中添加一個(gè)QLabel控件作一個(gè)簡(jiǎn)單的信息顯示即可。同樣，在設(shè)計(jì)師中不能直接將QLabel控件放到狀態(tài)欄區(qū)域中，后面需在代碼中手動(dòng)創(chuàng)建該控件。

7、主顯示區(qū)域設(shè)計(jì)

本例中，主顯示區(qū)域分為左一右二的三個(gè)窗口，使用分割條進(jìn)行布局。為簡(jiǎn)單起見(jiàn)，本例使用三個(gè)”Plain Text Edit”控件作為顯示窗口。在設(shè)計(jì)師中拖放三個(gè)狀態(tài)欄”Plain Text Edit”控件到主窗口區(qū)域中，分別命名為leftWnd、rightWnd1和rightWnd2，同時(shí)，在屬性編輯器設(shè)置三個(gè)控件的plainText屬性分別為左窗口、右窗口1、右窗口2。然后選中rightWnd1和rightWnd2，在設(shè)計(jì)師中選擇”使用分裂器垂直布局”，完成右面兩個(gè)窗口的垂直布局。然后再選中這個(gè)垂直布局和leftWnd窗口，在設(shè)計(jì)師中選擇”使用分裂器水平布局”，這樣使用水平分割條完成了整個(gè)界面左、右兩部分的水平布局。如下圖所示：

8、信號(hào)/槽的設(shè)計(jì)

在設(shè)計(jì)師的信號(hào)/槽編輯器中可完成信號(hào)與槽函數(shù)的關(guān)聯(lián)，對(duì)于本例，將動(dòng)作actExit關(guān)聯(lián)到主窗口的關(guān)閉事件中，這樣，在工具欄中點(diǎn)擊退出按鈕時(shí)，可退出該程序，如下圖所示：

至此，在設(shè)計(jì)師中完成了整個(gè)界面的設(shè)計(jì)，保存文件。該界面中涉及到的所有界面對(duì)象元素如下圖所示：

界面文件至Python文件的轉(zhuǎn)換

在設(shè)計(jì)師中界面設(shè)計(jì)完成后，我們得到了兩個(gè)文件：”Main.ui”界面文件和”MyRes.qrc”資源文件，需將這兩個(gè)文件轉(zhuǎn)換為Python能夠識(shí)別的文件，這就用到了前面提到的已經(jīng)集成好的兩個(gè)工具”PyUIC”和”Rcc2Py”。

在PyCharm開(kāi)發(fā)環(huán)境中，選中這兩個(gè)文件，在右鍵菜單中分別選擇”PyQt4–>PyUIC”和”PyQt4–>Rcc2Py”即可完成這兩個(gè)文件的轉(zhuǎn)換。

轉(zhuǎn)換完成后，生成了兩個(gè)新的文件，分別為界面文件”Ui_Main.py”和資源文件”MyRes_rc.py”。

其中，”Ui_Main.py”文件中主要定義了一個(gè)界面布局類”Ui_MainWindow”，在該類中，會(huì)自動(dòng)導(dǎo)入”MyRes_rc.py”的內(nèi)容。

主程序”Main.py”的編寫(xiě)

在PyCharm開(kāi)發(fā)環(huán)境中新建一個(gè)Python文件”Main.py”。其調(diào)用界面文件的主要思路為：

定義一個(gè)類MainWindow，繼承自QMainWindow和Ui_MainWindow類，在該類中實(shí)現(xiàn)設(shè)計(jì)師中不能完成的界面元素，如本例中工具欄上的下拉菜單按鈕和狀態(tài)欄上的label控件等，實(shí)現(xiàn)信號(hào)與槽函數(shù)的關(guān)聯(lián)，完成槽函數(shù)的實(shí)現(xiàn)。

MainWindow類的具體實(shí)現(xiàn)代碼如下圖所示：

對(duì)上述代碼說(shuō)明如下：

第16-45行，類的初始化函數(shù)。

第20-36行，添加設(shè)計(jì)師中不能完成的界面元素，詳細(xì)請(qǐng)參考注釋。

第38-40行，實(shí)現(xiàn)兩個(gè)動(dòng)作與槽函數(shù)的關(guān)聯(lián)，用以設(shè)置工具欄的樣式和右邊兩個(gè)窗口是否可見(jiàn)。

第42-45行，設(shè)置主分割條mainSplitter的左右兩邊的比例，并將其設(shè)置為主窗口的中心部件。

第47-57行，兩個(gè)槽函數(shù)的具體實(shí)現(xiàn)。

程序的完整測(cè)試代碼如下圖所示：

程序運(yùn)行后，即可看到本文開(kāi)頭的提到的界面運(yùn)行圖。

備注

本例開(kāi)發(fā)環(huán)境配置：Python2.7 PyQt4。

如果你覺(jué)得這篇文章對(duì)你有用的話，抖抖小手點(diǎn)個(gè)贊吧。