（6）pyqt5—＞視窗跳轉（註冊登入功能）

GitHub連接：
本專欄所有原始碼的GitHub直通車

本專欄所有原始碼的Gitte地址

上一篇已經講了連接訊號和槽的另外一種方法

這篇部落格本來在2020年年末就應該發出來了，一直拖到現在！ 在復習的空閑，能夠去寫一下舒心的東西真的享受

這次主要的內容就是介面跳轉實現登入功能

我用的辦法比較的笨拙，但是能用。其實只要完成一個事情就完全OK了：當你的登入按鈕的click時間被處觸發的時候，你連接的槽函式應該是你自己的登入API，當然我這次用的是我自己伺服器的登入介面函式，你們使用的時候換成自己的登入API就可以，話說回來，如果你驗證成功了，你需要向兩個介面分別傳遞訊息，做出關閉本視窗和開啟新視窗的動作，我習慣於將槽函式寫在我自己的類裡面，這樣子就沒法給另外一個視窗物件傳遞訊息（暫時沒想到好方法），所以我直接將這個槽函式直接寫在主執行緒中，然後按鈕繫結事件也在槽函式之後繫結。

以前在寫tkinter的時候就是這麼乾的，暫時沒有出什麼問題，可以說是簡單粗暴

本次的程式碼檔案主要是有

  • login_ui.py
  • main_ui.py
  • main.py

前兩個是ui轉過來的py檔案，main.py檔案是程式執行的檔案

如果不想去GitHub上面下載程式碼的話，我就直接貼出來了

login_ui.py

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'login.ui'
#
# Created by: PyQt5 UI code generator 5.15.2
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again.  Do not edit this file unless you know what you are doing.


from PyQt5 import QtCore, QtGui, QtWidgets


class Ui_login(object):
    def setupUi(self, login):
        login.setObjectName("login")
        #login.setStyleSheet("#login{background-color:green}")
        login.resize(412, 269)
        self.id_label = QtWidgets.QLabel(login)
        self.id_label.setGeometry(QtCore.QRect(110, 60, 51, 41))
        font = QtGui.QFont()
        font.setFamily("Agency FB")
        font.setPointSize(14)
        self.id_label.setFont(font)
        self.id_label.setObjectName("id_label")
        self.pw_label_2 = QtWidgets.QLabel(login)
        self.pw_label_2.setGeometry(QtCore.QRect(110, 120, 51, 41))
        font = QtGui.QFont()
        font.setFamily("Agency FB")
        font.setPointSize(14)
        self.pw_label_2.setFont(font)
        self.pw_label_2.setObjectName("pw_label_2")
        self.login_pushButton = QtWidgets.QPushButton(login)
        self.login_pushButton.setGeometry(QtCore.QRect(100, 200, 75, 23))
        self.login_pushButton.setObjectName("login_pushButton")
        self.exit_pushButton = QtWidgets.QPushButton(login)
        self.exit_pushButton.setGeometry(QtCore.QRect(240, 200, 75, 23))
        self.exit_pushButton.setObjectName("exit_pushButton")
        self.lineEdit_id = QtWidgets.QLineEdit(login)
        self.lineEdit_id.setGeometry(QtCore.QRect(170, 70, 113, 20))
        self.lineEdit_id.setObjectName("lineEdit_id")
        self.lineEdit_pw = QtWidgets.QLineEdit(login)
        self.lineEdit_pw.setGeometry(QtCore.QRect(170, 130, 113, 20))
        self.lineEdit_pw.setObjectName("lineEdit_pw")
        self.lineEdit_pw.setEchoMode(QtWidgets.QLineEdit.Password)
        self.retranslateUi(login)
        self.exit_pushButton.clicked.connect(login.close)
        QtCore.QMetaObject.connectSlotsByName(login)

    def retranslateUi(self, login):
        _translate = QtCore.QCoreApplication.translate
        login.setWindowTitle(_translate("login", "Form"))
        self.id_label.setText(_translate("login", "賬號"))
        self.pw_label_2.setText(_translate("login", "密碼"))
        self.login_pushButton.setText(_translate("login", "登入"))
        self.exit_pushButton.setText(_translate("login", "退出"))

main_ui.py檔案

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'main.ui'
#
# Created by: PyQt5 UI code generator 5.15.2
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again.  Do not edit this file unless you know what you are doing.


from PyQt5 import QtCore, QtGui, QtWidgets


class Ui_main(object):
    def setupUi(self, main):
        main.setObjectName("main")
        main.resize(1007, 631)

        self.retranslateUi(main)
        QtCore.QMetaObject.connectSlotsByName(main)

    def retranslateUi(self, main):
        _translate = QtCore.QCoreApplication.translate
        main.setWindowTitle(_translate("main", "Form"))

main.py檔案

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
"""
/********************************************************************************
* @Filename: main.py
* @Author: haomingHu
* @Version: 1.0
* @Date:  2021-03-26
* @Description:
* @History:
********************************************************************************/
"""



from login_ui import Ui_login
from main_ui  import Ui_main
import sys
from PyQt5 import QtWidgets
from PyQt5.QtGui import QPalette,QBrush,QPixmap
from PyQt5.QtCore import Qt

class myLogin(QtWidgets.QWidget,Ui_login):
    login_state = 0
    def __init__(self):
        super(myLogin,self).__init__()
        self.setupUi(self)
        loginPalette = QPalette()
        loginPalette.setBrush(QPalette.Background, QBrush(QPixmap("./loginbackground.jpg")))
        #loginPalette.setColor(QPalette.Background, Qt.blue)
        self.setPalette(loginPalette)

class myMainGui(QtWidgets.QWidget,Ui_main):
    userID = ""
    #建構函式
    def __init__(self):
        super(myMainGui,self).__init__()
        self.setupUi(self)

    def closeEvent(self,event):#函式名固定不可變
        reply=QtWidgets.QMessageBox.question(self,u'Notice!',u'Are you  sure to exit?'
            ,QtWidgets.QMessageBox.Yes,QtWidgets.QMessageBox.No)
        #QtWidgets.QMessageBox.question(self,u'彈窗名',u'彈窗內容',選項1,選項2)
        if reply==QtWidgets.QMessageBox.Yes:
            event.accept()#關閉視窗
        else:
            event.ignore()#忽視點選X事件



if __name__ == "__main__":
    app = QtWidgets.QApplication(sys.argv)
    myLogin = myLogin()
    myLogin.show()
    mainGUI = myMainGui()
   
    userIDSure = ""
    flag = 0
    def login_check():
        userID = myLogin.lineEdit_id.text()
        user_PW = myLogin.lineEdit_pw.text()
        print(userID)
        print(user_PW)
        '''
        這裡我使用的是我伺服器的登入請求介面
        使用的時候換成自己封裝好的登入驗證介面即可
        '''
       
        '''
        正常來說，登入成功的話，需要將登入成功的使用者訊息回傳給主介面
        也就是告訴主介面，是哪個使用者登入了，這個時候可以在主介面的類中定義
        一些類屬性，如果登入成功，則將lineedit物件的輸入內容賦值給類屬性即可
        '''
        #login_flag = event.loginRequest(userID,user_PW)
        #if login_flag == 0:
        if userID == "1" and user_PW == "1":
            myLogin.login_state = 1
            mainGUI.userID = myLogin.lineEdit_id.text()
            myLogin.close()
            mainGUI.show()
           
    myLogin.login_pushButton.clicked.connect(login_check)

    sys.exit(app.exec_())

補充知識點：

  • 取得lineedit的輸入內容方法：

使用lineedit的text方法直接取得，取得的物件是一個字串的物件。

1
2
        userID = myLogin.lineEdit_id.text()
        user_PW = myLogin.lineEdit_pw.text()

  • 設定背景（後面會寫一個部落格）
  1. 視窗物件自帶的setStyleSheet方法
1
2
3
?    login.setObjectName("login")

?    login.setStyleSheet("#login{background-color:green}")

? 2、使用QPalette類

1
2
3
4
window = QMainWindow()
palette = QPalette()
palette.setColor(QPalette.Background, Qt.red)
window.setPalette(palette)

祝大家生活開心，學習開心！