Stylish PyQT: Customizing QLineEdit, QPushButton, and QWidget for a Login Window

In this tutorial, we will be exploring how to use PyQt Style Sheets to customize the look and feel of a login window using QLineEdit, QPushButton, and QWidget.

To get started, you will need to have PyQt installed on your computer. If you haven’t already installed it, you can do so by using pip:

pip install PyQt5

Once you have PyQt installed, create a new Python file and import the necessary modules:

from PyQt5.QtWidgets import QApplication, QWidget, QLineEdit, QPushButton
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import Qt

Next, create a class for the login window:

class LoginWindow(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("Login Window")
        self.setGeometry(100, 100, 400, 200)

        self.init_ui()

    def init_ui(self):
        username = QLineEdit(self)
        username.setPlaceholderText("Username")
        username.setGeometry(100, 50, 200, 30)

        password = QLineEdit(self)
        password.setPlaceholderText("Password")
        password.setEchoMode(QLineEdit.Password)
        password.setGeometry(100, 100, 200, 30)

        login_btn = QPushButton("Login", self)
        login_btn.setGeometry(150, 150, 100, 30)

Now, let’s add some style to our login window using PyQt Style Sheets. PyQt Style Sheets allow you to customize the appearance of widgets by defining colors, fonts, and other properties.

self.setStyleSheet("""
    background-color: #f0f0f0;
    QLineEdit {
        border: 2px solid #333;
        border-radius: 5px;
        padding: 5px;
        background-color: #fff;
        color: #333;
    }
    QPushButton {
        background-color: #007bff;
        color: #fff;
        border: none;
        padding: 5px 10px;
        border-radius: 5px;
    }
    QPushButton:hover {
        background-color: #0056b3;
    }
""")

In this style sheet, we’ve set the background color of the login window to a light gray (#f0f0f0). We’ve also customized the QLineEdit widget with a border, rounded corners, and a white background. The QPushButton widget has a blue background, white text, and rounded corners. When the button is hovered over, it changes color to a darker shade of blue.

Finally, create an instance of the LoginWindow class and run the application:

if __name__ == '__main__':
    app = QApplication([])
    login_window = LoginWindow()
    login_window.show()
    app.setStyle("Fusion")
    app.exec_()

And that’s it! You now have a customized login window using QLineEdit, QPushButton, and QWidget with PyQt Style Sheets. Feel free to experiment with different styles and properties to create a unique look for your application.