Creating Frame in PyQt5 (QFrame): Building a Structured GUI
In this PyQt5 article i want to show you How To Create Frame In PyQt5 (QFrame) with QFrame class, it is a fundamental component in PyQt5 for building graphical user interfaces (GUI) in Python desktop applications.
Introduction to PyQt5 and QFrame
PyQt5 is a widely used Python library for developing desktop applications with a graphical user interface (GUI). It offers a variety of widgets, including frames, which are essential for organizing different elements of the GUI. Frames provide a means to group widgets, facilitating more organized layout.
Installation of PyQt5
So before starting our coding we need to install PyQt5. you can do this using pip, a package manager for Python. Open your terminal and type the following command:
1 |
pip install PyQt5 |
Initializing PyQt5 and QFrame
So after installation, now can create our frame, to create a frame, we first need to import the necessary modules. open your Python code editor and add the following code at the top of your file:
1 2 3 |
import sys from PyQt5.QtWidgets import QApplication, QFrame, QWidget from PyQt5.QtGui import QColor |
The first line imports the sys module, which is built in module that provides access to some variables used or maintained by the interpreter and to functions that interact strongly with the interpreter. second line imports the QApplication, QFrame and QWidget classes from the PyQt5.QtWidgets module, which is a module that contains different classes for building GUI applications. third line imports the QColor class from the PyQt5.QtGui module, which is a module that contains classes for handling graphical user interface objects and their display.
Creating the Main Window
After that we need to create main window for our application. add the following code:
1 2 3 4 5 6 7 8 9 |
class MainWindow(QWidget): def __init__(self): super().__init__() self.initUI() def initUI(self): self.setGeometry(100, 100, 400, 300) self.setWindowTitle('PyQt5 Frame Example') |
This creates new class called MainWindow that inherits from the QWidget class. init() method initializes the class and calls the initUI() method, which sets the size of the window and sets the window title.
Creating the Frame
Now, let’s create the frame. Add the following code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
class MainWindow(QWidget): def __init__(self): super().__init__() self.initUI() def initUI(self): self.setGeometry(100, 100, 400, 300) self.setWindowTitle('PyQt5 Frame Example') frame = QFrame(self) frame.setFrameShape(QFrame.StyledPanel) frame.setGeometry(20, 20, 360, 260) frame.setStyleSheet("background-color: #f0f0f0;") |
This creates new QFrame object and sets its shape to StyledPanel. setFrameShape() method sets the shape of the frame, and we have chosen to use the StyledPanel shape. setGeometry() method sets the position and size of the frame. setStyleSheet() method sets the background color of the frame.
Displaying the Window
And finally, we need to show the window. Add the following code:
1 2 3 4 5 |
if __name__ == '__main__': app = QApplication(sys.argv) window = MainWindow() window.show() sys.exit(app.exec_()) |
This initializes new QApplication object, creates new MainWindow object, shows the window, and starts the application event loop.
Now that we have created our frame, we can add widgets to it. we can add widgets like buttons, labels and text boxes to the frame just as we would add them to a window. for example to add label to the frame, we would add the following code after creating the frame:
1 2 |
label = QLabel('Hello World', frame) label.move( |
This is the complete code for How To Create Frame In PyQt5 (QFrame)
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 |
import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QFrame from PyQt5.QtGui import QColor class Example(QMainWindow): def __init__(self): super().__init__() self.initUI() def initUI(self): # create a frame and set its properties frame = QFrame(self) frame.setFrameShape(QFrame.StyledPanel) frame.setStyleSheet("QWidget { background-color: %s }" % QColor(0, 0, 0).name()) frame.setGeometry(50, 50, 200, 200) self.setGeometry(300, 300, 350, 250) self.setWindowTitle('Frame Example') self.show() if __name__ == '__main__': app = QApplication(sys.argv) ex = Example() sys.exit(app.exec_()) |
In this code we have created simple frame with black background color. we have used the QFrame class to create the frame and set its properties. after that we have set the frame’s geometry and added it to the main window. Finally, we have set the main window’s title and size and showed it on the screen.
You can customize the frame’s properties, such as its shape, border width, and color, according to your needs.
Run the code and this will be the output
Final Thoughts
Congratulations! You’ve learned how to create frames in PyQt5 using the QFrame class, an essential skill for building sophisticated GUIs in Python desktop applications.
More Python GUI Articles
- Kivy GUI Development Tutorials
- TKinter GUI Development Tutorials
- Psyide2 GUI Development
- wxPython GUI Development Tutorials
- PyQt5 GUI Development Tutorials