一、引言

這學(xué)期兒子語(yǔ)文期末考試有一道這樣的題目：

這道題答案是B，兒子做錯(cuò)了選了C。我告訴他“車字旁”和“車”的筆順是不一樣的，因?yàn)槎哂幸粋€(gè)筆畫(huà)是不一樣的，“車字旁”下邊那筆是“提”，而“車”字是“橫”，規(guī)律就是先"橫"后“豎”，先“豎”后“提”，類似的還有“牛字旁”和“?！薄?/p>

為了驗(yàn)證我的說(shuō)法，我從網(wǎng)上又查了一下如下圖1和圖2所示。

圖1 “車”和“車子旁”筆順

圖2 “牛”和“牛字旁”和筆順

為了方便查詢每個(gè)字的筆順，我和兒子決定把他所學(xué)過(guò)的生字的筆順GIF動(dòng)圖都保存下來(lái)，然后編寫(xiě)一個(gè)小程序，想查哪個(gè)字的時(shí)候一輸入，就可以很快查到，不用再去網(wǎng)上搜索。

兒子最近再學(xué)C++，開(kāi)始想用C++來(lái)編寫(xiě)，但是發(fā)現(xiàn)用dev-c編寫(xiě)顯示GIF動(dòng)圖的資料比較少，也比較難實(shí)現(xiàn)。而用python的例子比較多，所以就決定用python來(lái)實(shí)現(xiàn)。經(jīng)過(guò)幾天的努力，基本實(shí)現(xiàn)了最初的基本想法，最終的效果如圖所示。

本程序簡(jiǎn)要說(shuō)明：在文本編輯框中輸入一個(gè)漢字，單擊“查詢”按鈕，如果程序中含有這個(gè)漢字的動(dòng)圖，那么就會(huì)在屏幕中進(jìn)行播放。下邊就把實(shí)現(xiàn)的過(guò)程做個(gè)介紹。

二、Python與?PyCharm

Python是一種腳本語(yǔ)言?。腳本語(yǔ)言（Scripting language）是一種電腦編程語(yǔ)言，通常以簡(jiǎn)單的方式快速完成某些復(fù)雜的事情。Python是一種解釋型的腳本語(yǔ)言，這意味著它的代碼在運(yùn)行之前不需要顯式的編譯步驟，而是通過(guò)解釋器逐行解釋執(zhí)行。Python語(yǔ)言具有易學(xué)易用、開(kāi)發(fā)效率高、運(yùn)行速度快等優(yōu)點(diǎn)，因此在數(shù)據(jù)科學(xué)、人工智能、Web開(kāi)發(fā)、游戲開(kāi)發(fā)等領(lǐng)域都有廣泛的應(yīng)用。本文用的python版本是3.12.1。

?PyCharm?是由JetBrains開(kāi)發(fā)的一個(gè)專門為Python設(shè)計(jì)的IDE，帶有一整套用戶在使用Python語(yǔ)言開(kāi)發(fā)時(shí)提高其效率的工具，比如調(diào)試、語(yǔ)法高亮、項(xiàng)目管理、代碼跳轉(zhuǎn)、智能提示、自動(dòng)完成、單元測(cè)試、版本控制。此外，該IDE提供了一些高級(jí)功能，以用于支持Django框架下的專業(yè)Web開(kāi)發(fā)。它支持多種Python版本，包括Python 3.5及更高版本。本文用的pycharm版本是2024.1.1。

在使用PyCharm進(jìn)行Python開(kāi)發(fā)時(shí)，需要配置Python環(huán)境，以便PyCharm能夠找到Python解釋器并執(zhí)行Python代碼。PyCharm支持Python 2.x和Python 3.x版本，用戶可以根據(jù)自己的需要選擇不同的Python版本進(jìn)行開(kāi)發(fā)。此外，PyCharm還提供了豐富的插件和擴(kuò)展，幫助用戶增強(qiáng)開(kāi)發(fā)體驗(yàn)和提高開(kāi)發(fā)效率。

三、PySide6及其自帶的designer

PySide6是Qt for Python的一部分，是一個(gè)Python綁定庫(kù)，用于創(chuàng)建跨平臺(tái)的GUI應(yīng)用程序。PySide6是QT company官方維護(hù)的項(xiàng)目，支持LGPL協(xié)議，適用于開(kāi)源和商業(yè)用途?。PySide6自帶了一個(gè)可以手動(dòng)設(shè)計(jì)UI的designer，方便設(shè)計(jì)，并且可以直觀看到界面的最終效果。一般的UI設(shè)計(jì)，是先用designer設(shè)計(jì)出界面，然后再把UI轉(zhuǎn)成python語(yǔ)言格式，用pycharm平臺(tái)進(jìn)行功能代碼的編寫(xiě)。

本文默認(rèn)pycharm和python已經(jīng)安裝完成，從安裝PySide6開(kāi)始介紹。

pip install PySide6 -i https://pypi.tuna.tsinghua.edu.cn/simple

下載的目錄默認(rèn)在python安裝的目錄下的\Lib\site-packages\PySide6文件夾內(nèi)。

找到PySide6安裝目錄，打開(kāi)designer應(yīng)用程序，如圖5所示。

四、程序?qū)崿F(xiàn)步驟

4.1 創(chuàng)建pycharm工程文件

打開(kāi)pycharm軟件，如果是第一次使用，那么界面如下圖所示。操作步驟如下：

單擊“New Project”，如圖6所示。

在圖所示的頁(yè)面中填入工程名稱(Name)，本例的名稱為“mystroke”，選擇工程存放的地址(Location)，并選擇python版本，然后點(diǎn)“Create”按鈕，如圖7所示。

創(chuàng)建好的工程如圖8所示。

4.2 UI設(shè)計(jì)步驟

UI設(shè)計(jì)使用PySide6自帶的designer。

4.2.1在pycharm中引入designer做為外部工具

第一步：在菜單“File”中選擇“Settings”選項(xiàng)，如圖9所示。

第二步：在“Settings”頁(yè)面中，選擇“Tools”項(xiàng)目下的“External Tools”選項(xiàng)，點(diǎn)右側(cè)列表左上角的“+”號(hào)，添加外部工具，如圖10所示。

第三步：在Create Tool對(duì)話框中，填好外部程序的名稱(Name)，選擇外部程序pyside6下的designer.exe的所在位置(Program)，然后單擊“OK”按鈕，如圖11所示。注意，一定要先填名字后選程序位置，名字可以隨便取。

此時(shí)，在External Tools的列表框中出現(xiàn)了剛剛添加的Pyside6Designer。

第四步：在pycharm中打開(kāi)Pyside6Designer。在“Tools”菜單中，選擇“External Tools”下的Pyside6Designer，即可打開(kāi)Designer，如圖12所示。

4.2.1 利用designer設(shè)計(jì)UI

第一步：創(chuàng)建窗體。打開(kāi)designer后，選擇“Main Window”，然后單擊“創(chuàng)建”，如圖13所示。

第二步：在窗體上添加一個(gè)文本編輯框。在頁(yè)面左側(cè)“窗口部件盒”中選擇Line Edit對(duì)象，并拖動(dòng)到窗體上，如圖14所示。

第三步：在窗體上添加一個(gè)按鈕。在頁(yè)面左側(cè)“窗口部件盒”中選擇Push Button對(duì)象，并拖動(dòng)到窗體上，如圖15所示。

第四步：在窗體上添加一個(gè)動(dòng)圖顯示框。在頁(yè)面左側(cè)“窗口部件盒”中選擇Label對(duì)象，并拖動(dòng)到窗體上，如圖16所示。

第五步：在右側(cè)對(duì)象檢查器中查看三個(gè)對(duì)象的名稱，圖中紅框中第一列是對(duì)象名字，第二列是所屬類名，如圖17所示。

第六步：修改lineEdit的初始顯示內(nèi)容。在窗體上選中l(wèi)ineEdit對(duì)象，在右側(cè)屬性編輯器中text屬性后的內(nèi)容修改為“請(qǐng)輸入要查詢的字”，如圖18所示。

第七步：選中pushButton，text屬性修改為“查詢”，如圖19所示。

第八步：清空l(shuí)abel的text屬性內(nèi)容，如圖20所示。因?yàn)榫W(wǎng)上下載的字筆順動(dòng)圖的像素是600*600的，所以label的外框要拉大一些，然不然字的筆順動(dòng)圖顯示不全。

第九步：把設(shè)計(jì)好的UI保存到pycharm創(chuàng)建的工程mystroke的目錄下，UI的名稱為mystroke_ui，如圖21所示。

4.3?準(zhǔn)備字筆順動(dòng)圖

在mystroke的工程目錄下新建一個(gè)gif文件夾，如圖22所示。

從網(wǎng)上搜索“爸筆順”，找到爸字的筆順動(dòng)圖，然后在動(dòng)圖上鼠標(biāo)右鍵“將圖像另存為”，然后把動(dòng)圖存放到gif文件夾內(nèi)，如圖23所示。

4.4 編寫(xiě)python代碼

4.4.1 為pycharm工程文件添加python程序

在pycharm的mystroke工程名字上右鍵單擊，在彈出菜單中選擇“New”——"Python File"，如圖24所示。

在New Python file對(duì)話框中輸入python程序名稱為“mystroke”，文件類型選擇“Python file”，然后按回車鍵，完成新建mystroke.py文件，如圖25所示。

完成新建后的頁(yè)面如圖26所示。

4.4.2 編寫(xiě)mystroke.py代碼

在新建的mystroke.py文件中輸入以下代碼：

import sys
from PySide6.QtCore import QFile, QIODevice, Slot
from PySide6.QtUiTools import QUiLoader
from PySide6.QtWidgets import QApplication, QMainWindow, QMessageBox, QPushButton, QTextBrowser
from PySide6.QtGui import QMovie# 定義主窗口類
class MainWindow(QMainWindow):def __init__(self):super().__init__()# 加載UI文件loader = QUiLoader()ui_file = QFile("mystroke_ui.ui")if not ui_file.open(QIODevice.ReadOnly):print("無(wú)法打開(kāi)UI文件")sys.exit(-1)# 加載UI文件并實(shí)例化為窗口對(duì)象self.window = loader.load(ui_file)# 關(guān)閉UI文件ui_file.close()# 獲取UI文件中的小部件對(duì)象self.button1 = self.window.findChild(QPushButton, "pushButton")self.lineEdit = self.window.findChild(QLineEdit, "lineEdit")self.label = self.window.findChild(QLabel, "label")# 連接信號(hào)和槽self.button1.clicked.connect(self.bt_transmit_click)# 按鈕點(diǎn)擊事件處理函數(shù)@Slot()def bt_transmit_click(self):#創(chuàng)建一個(gè)movie對(duì)象，用于播放GIF動(dòng)圖self.movie = QMovie("./gif/"+self.lineEdit.text()+".gif")#在label中設(shè)置movieself.label.setMovie(self.movie)#播放movieself.movie.start()# 主程序
if __name__ == "__main__":# 創(chuàng)建一個(gè)QApplication對(duì)象，它是PySide6應(yīng)用程序的核心，負(fù)責(zé)處理事件和管理應(yīng)用程序的生命周期。app = QApplication([])# 創(chuàng)建一個(gè)MainWindow對(duì)象，即主窗口類的實(shí)例。main_window = MainWindow()# 調(diào)用主窗口對(duì)象的show()方法，將主窗口顯示在屏幕上。main_window.window.show()# 啟動(dòng)應(yīng)用程序的事件循環(huán)，使得應(yīng)用程序能夠響應(yīng)用戶的輸入和系統(tǒng)事件，保持運(yùn)行狀態(tài)。app.exec()

4.4.2 mystroke.py核心代碼的解讀

第一部分：加載UI程序段。UI文件的加載程序如下所示，把用pyside6 designer設(shè)計(jì)的界面“mystroke_ui”加載到python程序中來(lái)，然后把原UI文件關(guān)閉。

    # 加載UI文件loader = QUiLoader()ui_file = QFile("mystroke_ui.ui")if not ui_file.open(QIODevice.ReadOnly):print("無(wú)法打開(kāi)UI文件")sys.exit(-1)# 加載UI文件并實(shí)例化為窗口對(duì)象self.window = loader.load(ui_file)# 關(guān)閉UI文件ui_file.close()

第二部分：獲取UI中控件對(duì)象程序段。獲取UI中控件對(duì)象的方法為self.window.findChild?，該方法是一個(gè)在 PySide6 中用于查找窗口子部件的方法，它的基本語(yǔ)法是：

childObject = self.window.findChild(class_type, name)

該方法有兩個(gè)參數(shù)，第一個(gè)參數(shù)是部件的類型，第二個(gè)參數(shù)是UI上部件的名稱。

本文UI上一共有三個(gè)部件：一個(gè)pushButton，一個(gè)lineEdit，一個(gè)label，獲取的代碼如下：

    # 獲取UI文件中的小部件對(duì)象self.button1 = self.window.findChild(QPushButton, "pushButton")self.lineEdit = self.window.findChild(QLineEdit, "lineEdit")self.label = self.window.findChild(QLabel, "label")

第三部分：信號(hào)和槽綁定程序段

PySide6中的信號(hào)和槽機(jī)制是一種用于對(duì)象間通信的機(jī)制。信號(hào)（Signal）是在特定事件發(fā)生時(shí)由對(duì)象發(fā)出的消息，而槽（Slot）是用于接收并處理這些信號(hào)的函數(shù)。信號(hào)和槽機(jī)制允許對(duì)象在事件發(fā)生時(shí)進(jìn)行交互，而不必了解彼此的具體實(shí)現(xiàn)，從而實(shí)現(xiàn)了低耦合的通信方式。

本例的信號(hào)和信號(hào)接收槽各有一個(gè)，信號(hào)就是單擊pushButton，槽里的接收函數(shù)也只有一個(gè)。信號(hào)和槽函數(shù)綁定的程序如下圖所示。

 # 連接信號(hào)和槽self.button1.clicked.connect(self.bt_transmit_click)

第四部分：槽函數(shù)程序段

槽函數(shù)bt_transmit_click(self)函數(shù)體一共有三行，如圖所示。

    # 按鈕點(diǎn)擊事件處理函數(shù)@Slot()def bt_transmit_click(self):#創(chuàng)建一個(gè)movie對(duì)象，用于播放GIF動(dòng)圖self.movie = QMovie("./gif/"+self.lineEdit.text()+".gif")#在label中設(shè)置movieself.label.setMovie(self.movie)#播放movieself.movie.start()

第一行，給movie設(shè)置了GIF動(dòng)圖的地址，這個(gè)地址是各字符串形式，由三部分拼接而成。第一部分“./gif/”是指明動(dòng)圖的存放文件夾為“gif”；第二部分self.lineEdit.text()，是取編輯框內(nèi)文字，也就是動(dòng)圖的名稱；第三部分是動(dòng)圖的后綴".gif"。

第二行，使用?setMovie?方法將?QMovie?對(duì)象設(shè)置到?QLabel?上。

第三行，播放movie，也就是播放GIF動(dòng)圖。

（本文結(jié)束）