Membuat Halaman Login Menggunakan PyQt5

Feri Lukmansyah

Membuat Halaman Login Menggunakan PyQt5 – pesonainformatika.com, dengan bahasa pemrograman python, kita dapat membuat aplikasi desktop, menggunakan berbagai library salah satunya menggunakan PyQt5. pada studi kasus kali ini kita akan belajar membuat halaman login sederhana menggunakan python.

Persiapan Project

sebelum membuat project ini pastikan sudah menginstall python dalam perangkat komputer masing masing dan mempunyai text editor, bisa menggunakan Pycharm, vscode atau yang lainya, yap lanjut ke persiapan selanjutnya.

Install Package yang Dibutuhkan

untuk membuat aplikasi desktop kita perlu menginstall library nya terlebih dahulu, kita dapat mencari librarynya di https://pypi.org/ masukan keyword PyQt5 atau bisa klik disini atau bisa dengan perintah

pip install PyQt5

lakukan perintah diatas menggunakan terminal atau command prompt setelah selesai buat file dengan nama misalnya main.py

Membuat Program

setelah melakukan tahap persiapan kali ini tiba saatnya kita membuat program langkah pertama yang harus dilakukan adalah import modul yang dibutuhkan seperti ini

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QPushButton, QLabel, QLineEdit, QGridLayout, QMessageBox

setelah itu kita membuat class untuk membuat interface (window) aplikasi kita, dari class ini kita konfigurasi dasar seperti mengeset layout, ukuran window, dan title untuk window yang kita buat, codenya seperti ini

def __init__(self):
    super(MainWindow, self).__init__()
    self.setWindowTitle("Simple Login Form")
    self.resize(500, 120)

    # set layout
    layout = QGridLayout()

kemudian kita juga membuat form untuk input username dan password, berikut adalah konfigurasi form layout pada form username dan password

# set layout display for username
label_name = QLabel('<font size="4"> Username: ')
self.lineEdit_username = QLineEdit()
self.lineEdit_username.setPlaceholderText("Masukan Username: ")
layout.addWidget(label_name, 0, 0)
layout.addWidget(self.lineEdit_username, 0, 1)

# set layout display for password
label_password = QLabel('<font size="4"> Password: ')
self.lineEdit_password = QLineEdit()
self.lineEdit_password.setPlaceholderText("Masukan Password: ")
layout.addWidget(label_password, 1, 0)
layout.addWidget(self.lineEdit_password, 1, 1)

selanjutnya kita buat fungsi untuk validasi, username dan password, contoh simplenya seperti ini

# password valudator
    def password_checker(self):
        message = QMessageBox()

        if self.lineEdit_username.text() == "pesonainformatika" and self.lineEdit_password.text() == "secret":
            message.setText("Berhasil Login")
            message.exec_()
            app.quit()

        else:
            message.setText("Password anda salah")
            message.exec_()

nah selanjutnya, kita baru konfigurasi tombol login pada fungsi def __init__() seperti ini

# set button login
button_login = QPushButton('Login')
button_login.clicked.connect(self.password_checker)
layout.addWidget(button_login, 2, 0, 1, 2)
layout.setRowMinimumHeight(2, 75)

self.setLayout(layout)

jika kita perhatikan lagi fungsi button_login.clicked.connect(self.password_checker) adalah validasi nah fungsi validasi ini dimasukan ke button_login.clicked.connect() hingga jadi seperti ini

button_login.clicked.connect(self.password_checker)

dapat dilihat fungsi self.password_checker adalah fungsi yang kita buat untuk validasi password di luar fungsi def __init__(), nah selanjutnya kita finishing projectnya dengan menambahkan fungsi __main__ seperti ini

if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    window.show()

    sys.exit(app.exec_())

dalam fungsi tersebut kita inisialisasi aplikasi kita di variabel app, kemudan inisialisasi window kemudian setelah di inisialisasi kita tampilkan dan eksekusi app nya

window.show()
sys.exit(app.exec_())

dan jika dijalankan hasilnya seperti ini

tampilan ketika berhasil login
tampilan ketika password salah

Final Code

berikut adalah source code pada studi kasus kali ini

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QPushButton, QLabel, QLineEdit, QGridLayout, QMessageBox


class MainWindow(QWidget):
    def __init__(self):
        super(MainWindow, self).__init__()
        self.setWindowTitle("Simple Login Form")
        self.resize(500, 120)

        # set layout
        layout = QGridLayout()

        # set layout display for username
        label_name = QLabel('<font size="4"> Username: ')
        self.lineEdit_username = QLineEdit()
        self.lineEdit_username.setPlaceholderText("Masukan Username: ")
        layout.addWidget(label_name, 0, 0)
        layout.addWidget(self.lineEdit_username, 0, 1)

        # set layout display for password
        label_password = QLabel('<font size="4"> Password: ')
        self.lineEdit_password = QLineEdit()
        self.lineEdit_password.setPlaceholderText("Masukan Password: ")
        layout.addWidget(label_password, 1, 0)
        layout.addWidget(self.lineEdit_password, 1, 1)

        # set button login
        button_login = QPushButton('Login')
        button_login.clicked.connect(self.password_checker)
        layout.addWidget(button_login, 2, 0, 1, 2)
        layout.setRowMinimumHeight(2, 75)

        self.setLayout(layout)

    # password valudator
    def password_checker(self):
        message = QMessageBox()

        if self.lineEdit_username.text() == "pesonainformatika" and self.lineEdit_password.text() == "secret":
            message.setText("Berhasil Login")
            message.exec_()
            app.quit()

        else:
            message.setText("Password anda salah")
            message.exec_()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    window.show()

    sys.exit(app.exec_())

semoga bermanfaat dan mencoba, ikuti studi kasus lainya di pesonainformatika ada beberapa bahasa pemrograman lainya seperti Java, Python C++