【python&界面UI】PyQt5小白教程（較為簡單，但是可以大概理清思路）

以前寫界面都是用的Python自帶的tkinter，因為是Python自帶的模塊，所以方便性還行。但是布局不好處理，很簡陋，不好看。想追求一下美感以及整合一下其他腳本，所以就在找一個方便的方式寫UI。PyQt5就閃亮登場！

對比一下兩個UI的顯示，是不是一幕了然？（左側是tkinter寫的，右側是PyQt5寫的）

 

使用PyQt5寫UI，還有一個好處就是UI和功能代碼分離。用pyqt5設計的界面，生成的代碼模塊，完全不用動！單獨再新建一個py文件用於實現功能。從而實現了UI和功能分離。

注意：安裝的步驟在另外一個文檔寫了哈，就不重復寫。（https://www.cnblogs.com/jason-syc/p/13213917.html）

---

·啟動desinger.exe，展開如下圖的界面，先介紹一下。

 

 

 

區域1：主要的控件，需要什么直接拖拽到2區域。

區域2：布局，也可以理解為畫布，把1里面所需要的的控件拖到2上進行布局擺放就好

區域3：當前已有控件進行編輯（就是設置控件的詳細信息，比如按鈕的名字、字體、加粗、下划線、樣式等等）

區域4：對每個個控件的“ID”進行編輯

 

 

 

各個控件都有圖標，其實還是蠻直接的一個展示，有時間可以一個一個的拖拽到2進行查看。功能蠻豐富的，可以合理的布局使用。（ctrl+R就可以預覽效果）（嘗試漢化來着，但是沒有找到方法，如果有成功找到漢化的同學，希望留言教一下）

我就介紹幾個我用過的控件：

 

 

 

Tab widget：頂部可以多個標簽頁切換，每個標簽頁可以是一個獨立的功能區域

---

 

 

 

 

 Push Button：點擊按鈕，點擊一下就會有相應的響應，一般是一個功能想關聯的。

---

 

 

 

 

 Line Edit：單行輸入框，可以輸入文本

---

 

 

 

 

 Text Edit：多行顯示框，用於展示想要展示的文本信息

---

 

 

 

 

 Label：就是一個單純的文本顯示

---

 

 

實例說明

 

 

 

 比如上圖這樣的一個界面，直接拖拽生成，ctrl+s保存，生成ui文件。（如下圖，我在桌面創建一個文件夾test）

ps：上圖放了tab、lineEdit、textEdit、pushButton、label控件

 

 

 

 

 

轉換為py文件

 

 

 

 

下面就是關鍵了，界面UI代碼test.py生成了，但是我們想給這些界面加上功能，怎么做呢？可以打開test代碼看一眼，但是不要去做任何的改動。

 單獨新建一個py文件，MainCode.py，copy這一組代碼，F5運行，可以直接展示UI窗口了，但僅僅是展示，還沒有給加功能。

 

from PyQt5.QtWidgets import QApplication,QMainWindow,QFileDialog#必須要有，不求甚解
from PyQt5.QtWidgets import QMessageBox#消息框提示需要的模塊
import sys#必須要有，不求甚解
import test#調用界面UI

class MainCode(QMainWindow,test.Ui_MainWindow):
    def __init__(self):
        QMainWindow.__init__(self)
        test.Ui_MainWindow.__init__(self)
        self.setupUi(self)
      
if __name__=='__main__':
    app=QApplication(sys.argv)
    md=MainCode()
    md.show()
    sys.exit(app.exec_())

 

現在開始加功能，簡單一點。

1、 點擊左側的按鈕，直接輸出固定的英文“hello，wish *************”。

2、 頂部輸入文本，點擊右側的按鈕，輸出輸入的文本。

from PyQt5.QtWidgets import QApplication,QMainWindow,QFileDialog#必須要有，不求甚解
from PyQt5.QtWidgets import QMessageBox#消息框提示需要的模塊
import sys#必須要有，不求甚解
import test#調用界面UI



class MainCode(QMainWindow,test.Ui_MainWindow):
    def __init__(self):
        QMainWindow.__init__(self)
        test.Ui_MainWindow.__init__(self)
        self.setupUi(self)

        self.pushButton.clicked.connect(self.zuoceButton)#點擊左側的按鈕，就響應函數zuoceButton，pushButton是左側按鈕的名字，可以在代碼desinger查看或者UI代碼中查看獲得（也可以在設計界面時，自定義）
        self.pushButton_2.clicked.connect(self.youceButton)#點擊右側的按鈕，就響應函數youceButton，pushButton_2是右側按鈕的名字
        

    def zuoceButton(self):
        self.textEdit.append('hello,wish you have a nice day')#在底部大的框體輸出顯示固定英文文本，textEdit就是輸出展示框的名字，底部的大框
    
    def youceButton(self):#
        a = self.lineEdit.text()#獲得頂部的輸入框的文本信息，lineEdit就是輸入框的名字，頂部的框
        
        if len(a) == 0:#判斷是否有輸入
            QMessageBox.warning(self,'錯誤！！！','<font color=\"#FF0000\">沒有任何輸入！！！請在上面輸入文本。</font>')
            #上面就是一個提示框，還加了紅色字體
        else:
            self.textEdit.append(a)#在底部大的框體顯示輸入的文本信息
            

if __name__=='__main__':
    app=QApplication(sys.argv)
    md=MainCode()
    md.show()
    sys.exit(app.exec_())

直接F5運行即可。

 

很簡單的一個界面，但是能理清思路，希望能幫助到你，如果你有什么更好的學習地址或者方法等等可以留言給我，謝謝。有一些東西其實我也不是很懂，但是上述代碼肯定是可以運行的。照葫蘆畫瓢吧~，

還有一篇文章的鏈接在這里：https://www.cnblogs.com/jason-syc/p/13213917.html