4. PyQt5 기초(Box배치, Grid배치)

1. Box배치

02) 박스 레이아웃 - PyQt5 Tutorial - 파이썬으로 만드는 나만의 GUI 프로그램 (wikidocs.net)

 

02) 박스 레이아웃

02) 수직 배치를 위한 QVBoxLayout - 파이썬 PyQt로 만드는 나만의 HTS (wikidocs.net)

02) 수직 배치를 위한 QVBoxLayout

 

1) 수평 박스 배치

import sys 
from PyQt5.QtWidgets import *
from PyQt5.QtGui import * 

class MyWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        
        self.initUI()
        
    def initUI(self):
        self.setWindowTitle("physics Lab")
        self.setGeometry(300, 300, 400, 400) 
        self.setWindowIcon(QIcon("physics.png"))
        
        btn = QPushButton(text = "동영상 열기", parent = self)
        btn.clicked.connect(self.open_movie)
        
        btn2 = QPushButton(text = "프로그램 종료", parent = self)
        btn2.clicked.connect(self.close)
        
        # 수평 박스 선언
        hbox = QHBoxLayout()
        # 왼쪽부터 순서대로 빈칸, btn, bnt2, 빈칸
        hbox.addStretch(1)
        hbox.addWidget(btn)
        hbox.addWidget(btn2)
        hbox.addStretch(1)
        
        #QMainWindow를 상속받을 경우 이미 사전에 사용하는 레이아웃이 존재
        # 따라서 QWidget 클래스를 만들고 그 위에 hbox를 배치함.
        widget = QWidget()
        widget.setLayout(hbox)
        self.setCentralWidget(widget)

    def open_movie(self):
        print("동영상 불러오기를 성공하였습니다.")

app = QApplication(sys.argv)
win = MyWindow()
win.show()
app.exec_()

 

빈칸, 버튼, 버튼, 빈칸 이므로 아래와 같은 이미지로 설명할 수 있다.

 

실제 출력 결과, 빈칸 비율이 일정하게 유지된다.

 

 

2) 수직 박스 배치

수평 박스를 수직 박스에 넣고 배치시켜 보자, 아래와 같은 느낌으로 배치해 보자. 위 빈칸 3개, 수평 박스, 아래 빈칸 1개이다.

 

import sys 
from PyQt5.QtWidgets import *
from PyQt5.QtGui import * 

class MyWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        
        self.initUI()
        
    def initUI(self):
        self.setWindowTitle("physics Lab")
        self.setGeometry(300, 300, 400, 400) 
        self.setWindowIcon(QIcon("physics.png"))
        
        btn = QPushButton(text = "동영상 열기", parent = self)
        btn.clicked.connect(self.open_movie)
        
        btn2 = QPushButton(text = "프로그램 종료", parent = self)
        btn2.clicked.connect(self.close)
        
        # 수평 박스 선언
        hbox = QHBoxLayout()
        # 왼쪽부터 순서대로 빈칸, btn, bnt2, 빈칸
        hbox.addStretch(1)
        hbox.addWidget(btn)
        hbox.addWidget(btn2)
        hbox.addStretch(1)
        
        # 수직 박스 선언
        vbox = QVBoxLayout()
        # 위에서부터 순서대로 빈칸 3개, 수평 박스, 빈칸
        vbox.addStretch(3)
        vbox.addLayout(hbox)
        vbox.addStretch(1)
        
        #QMainWindow를 상속받을 경우 이미 사전에 사용하는 레이아웃이 존재
        # 따라서 QWidget 클래스를 만들고 그 위에 vbox를 배치함.
        widget = QWidget()
        widget.setLayout(vbox)
        self.setCentralWidget(widget)

    def open_movie(self):
        print("동영상 불러오기를 성공하였습니다.")

app = QApplication(sys.argv)
win = MyWindow()
win.show()
app.exec_()

 

 

아래 출력처럼 윗 빈칸과 아래 빈칸이 3:1로 유지된다.

 

 

2. Grid배치

03) 그리드 레이아웃 - PyQt5 Tutorial - 파이썬으로 만드는 나만의 GUI 프로그램 (wikidocs.net)

03) 그리드 레이아웃

 

그리드 배치는 위젯의 공간을 행(row)과 열(column)으로 구별하는 것을 뜻한다.

아래와 같이 행과 열에 Label, lineeditor, texteditor를 두어 보자

 

import sys 
from PyQt5.QtWidgets import *
from PyQt5.QtGui import * 

class MyWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        
        self.initUI()
        
    def initUI(self):
        self.setWindowTitle("physics Lab")
        self.setGeometry(300, 300, 400, 400) 
        self.setWindowIcon(QIcon("physics.png"))
        
        grid = QGridLayout()

        grid.addWidget(QLabel('Title:'), 0, 0)
        grid.addWidget(QLabel('Author:'), 1, 0)
        grid.addWidget(QLabel('Review:'), 2, 0)

        grid.addWidget(QLineEdit(), 0, 1)
        grid.addWidget(QLineEdit(), 1, 1)
        grid.addWidget(QTextEdit(), 2, 1)
        
        widget = QWidget()
        widget.setLayout(grid)
        self.setCentralWidget(widget)

app = QApplication(sys.argv)
win = MyWindow()
win.show()
app.exec_()