인생 코딩

지난번 탭 다이얼로그에, 글자(라벨)와 사진 3장을 넣은 탭을 만들어 보도록 하겠습니다.

스크롤 바를 내려 아래 사진들을 더 볼 수 있게 합니다.

결과 화면 : 

소스 코드 :

지난번 TabWidgetA 클래스에 아래의 내용을 추가합니다.

1. QLabel 로 텍스트를 추가합니다.
2. QScrollArea를 만듭니다.
   • QScrollArea에 사진을 넣기 위해, 먼저 widget을 하나 만들어 줍니다.
   • widget에 그림(pixmap)을 추가해 줍니다.
   • widget을 QScrollArea에 붙입니다.
3. QVBoxLayout에 위에서 만든 QLabel 과 QScrollArea를 추가합니다.
   (QVBoxLayout을 사용하는 이유는, 창 사이즈를 줄이거나/늘릴때 내용도 같이 동적으로 변하게 하기 위함)

class TabWidgetA(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        mainLayout = QVBoxLayout(self)

        self.label = QLabel(self)
        self.label.setText("Label text")

        self.scroll = QScrollArea(self)
        widget = QWidget()
        vBox = QVBoxLayout()
        for name in ('0001', '0002', '0003'):        	
            # pixmap 경로는 본인의 사진 파일이 있는 경로를 사용
            # (main 함수가 있는 .py 파일의 위치부터의 경로)
            pixmap = QPixmap("venv/qt/tabwidget/data/{}.jpg".format(name))
            label = QLabel(self)
            label.setPixmap(pixmap)
            label.resize(pixmap.width(), pixmap.height())
            vBox.addWidget(label)
        widget.setLayout(vBox)
        self.scroll.setWidget(widget)
        self.scroll.setVerticalScrollBarPolicy(Qt.ScrollBarAlwaysOn)
        self.scroll.setWidgetResizable(True)

        mainLayout.addWidget(self.label)
        mainLayout.addWidget(self.scroll)
        self.setLayout(mainLayout)

연결된 글 보기 :

[PyQt] Python에서 QTabWidget(탭 위젯) 사용하기

다이얼로그 창에 탭을 추가하는 방법입니다.

결과 화면 : 

소스 코드 : 

1. QDialog를 상속받은 다이얼로그 클래스를 만들고, QTabWidget에 addTab()을 해서 각 탭을 추가합니다.

# TabWidget.py

from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QTabWidget, \
    QVBoxLayout, QScrollArea, QDialog, QTableWidget, QTableWidgetItem
from PyQt5.QtCore import Qt
from PyQt5.QtGui import QPixmap

class TabDialog(QDialog):
    def __init__(self):
        QDialog.__init__(self)
        self.setWindowTitle("Tab Dialog")

        # Tab widget
        self.tabWidget = QTabWidget(self)
        self.tabWidget.addTab(TabWidgetA(), "tab1")	# 탭1 추가 - 여기 적힌 내용이 탭 제목으로 보여짐
        self.tabWidget.addTab(TabWidgetB(), "tab2")	# 탭2 추가 - 여기 적힌 내용이 탭 제목으로 보여짐

        self.mainLayout = QVBoxLayout(self)
        self.mainLayout.addWidget(self.tabWidget)
        self.setLayout(self.mainLayout)
        self.resize(600,400)

2. 추가되는 각 탭에 들어가는 내용은 QWidget을 상속받은 클래스로 만들어 줍니다.

# TabWidget.py

class TabWidgetA(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        # Do Something here...

class TabWidgetB(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        # Do Something here...

3. 메인에서 TabDialog를 실행합니다. 

# main.py

def start():
    app = QApplication(sys.argv)
    tabDialog = TabDialog()
    tabDialog.show()
    sys.exit(app.exec_())

if __name__ == '__main__':
	import sys
    start()

4. 아래는 전체 소스코드 입니다.

from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QTabWidget, \
    QVBoxLayout, QScrollArea, QDialog, QTableWidget, QTableWidgetItem
from PyQt5.QtCore import Qt
from PyQt5.QtGui import QPixmap

class TabDialog(QDialog):
    def __init__(self):
        QDialog.__init__(self)
        self.setWindowTitle("Tab Dialog")

        # Tab widget
        self.tabWidget = QTabWidget(self)
        self.tabWidget.addTab(TabWidgetA(), "tab1")	# 탭1 추가 - 여기 적힌 내용이 탭 제목으로 보여짐
        self.tabWidget.addTab(TabWidgetB(), "tab2")	# 탭2 추가 - 여기 적힌 내용이 탭 제목으로 보여짐

        self.mainLayout = QVBoxLayout(self)
        self.mainLayout.addWidget(self.tabWidget)
        self.setLayout(self.mainLayout)
        self.resize(600,400)

class TabWidgetA(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        # Do Something here...

class TabWidgetB(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        # Do Something here...

def start():
    app = QApplication(sys.argv)
    tabDialog = TabDialog()
    tabDialog.show()
    sys.exit(app.exec_())

if __name__ == '__main__':
	import sys
    start()

다음 편에서는, 탭 위젯에

1. 스크롤 영역에 그림을 넣은 탭 (QScrollArea, QPixmap 사용)

2. csv 파일의 데이터를 읽어 테이블 형태로 보여주는 탭 (QTableWidget)

을 추가해 보도록 하겠습니다.