인생 코딩

QTreeView의 아이템에 마우스를 올리면, 각 아이템 별로 다른 말풍선(툴팁)이 보여지도록 합니다.

결과 화면 :

소스 코드 :

1. 다이얼로그에 QTreeView를 생성합니다.
2. 모델을 생성해서, treeView에 연결합니다. (아래에서는 QStandardItemModel을 사용)
3. 모델에 아이템을 추가할 때, QStandardItem을 상속받은 TreeItem 클래스를 정의해서 사용합니다.
   • TreeItem 생성 시, 인자로 아이템에 입력할 데이터와, 툴팁 정보를 받음
   • item에 입력받은 데이터와 툴팁을 설정함

# qt/treeview/TreeView.py

from PyQt5.QtWidgets import QDialog, QTreeView
from PyQt5.QtGui import QStandardItem, QStandardItemModel

class TreeViewDialog(QDialog):
    def __init__(self):
        QDialog.__init__(self)
        self.treeView = QTreeView(self)
        self.model = QStandardItemModel()
        self.treeView.setModel(self.model)
        self.treeView.setHeaderHidden(True)
        rootParentItem = self.model.invisibleRootItem()
        # Add first item and it's children
        item = self.appendChild("category 1", rootParentItem, 'tooltip 1')
        for i in range(3):
            self.appendChild('a {}'.format(i), item, 'a tooltip {}'.format(i))

        # Add second item and it's children
        item = self.appendChild("category 2", rootParentItem, 'tooltip 1')
        for i in range(3):
            self.appendChild('b {}'.format(i), item, 'b tooltip {}'.format(i))

        self.treeView.setCurrentIndex(self.model.index(0, 0))
        self.treeView.expandAll()
        self.resize(400,200)

    def appendChild(self, title, parentItem, toolTip = None):
        item = TreeItem(title, toolTip)
        item.setData(title)
        parentItem.appendRow(item)
        return item


class TreeItem(QStandardItem):
    def __init__(self, text, toolTip):
        QStandardItem.__init__(self)
        self.setText(text)
        self.setToolTip(toolTip)

  4. 위 다이얼로그 실행을 위한 메인 파일

# main.py
from qt.treeview.TreeView import *
import sys

def start():
    app = QApplication(sys.argv)
    treeview = TreeViewDialog()
    treeview.show()
    sys.exit(app.exec_())

if __name__ == '__main__':
    start()

지난번 탭 위젯의 두번째 탭에, QTableWidget을 사용해 테이블을 추가해 보도록 하겠습니다.

테이블의 데이터는 csv 파일로부터 읽도록 합니다.

결과 화면 : 

소스 코드 : 

TabWidgetB 클래스에 아래의 내용을 추가합니다.

1. QTableWidget을 추가합니다.
   • setRowCount와 setColumnCount로 몇 행 몇 열의 테이블인지를 지정해 주어야 합니다.
     (데이터 파일의 총 line 수를 table의 rowCount로, 한 라인 안의 데이터 수를 table의 colCount로 설정합니다.)
   • setHorizontalHeaderLabels 로 테이블 헤더를 만들어 줍니다.
2. csv 파일에서 데이터를 읽습니다. (,로 구분된 파일)
3. 각 row, col에 읽은 데이터를 item으로 추가합니다. 
   • 아래에서는, (0,0) 셀부터 (2,2)셀까지 각 QTableWidgetItem을 만들어 추가해 주었습니다.
4. 필요하다면, setStyleSheet으로 헤더와 각 셀의 스타일을 지정합니다.

# qt/tabwidget/TabWidget.py

class TabWidgetB(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        self.tableWidget = QTableWidget(self)
        self.tableWidget.setMinimumSize(500, 200)
        self.tableWidget.setColumnCount(3)
        self.tableWidget.setHorizontalHeaderLabels(["header-1", "header-2", "header-3"])

        # read data from file
        # 경로는 본인 파일이 있는 경로로 설정
        # (main 함수가 있는 .py 파일 위치부터의 경로)
        with open('venv/qt/tabwidget/data/tab.csv', 'r', encoding='utf-8') as f:
            data = f.readlines()

        # Set data to tableWidget
        self.tableWidget.setRowCount(len(data))
        rowIdx = 0
        for line in data:
            cells = line.split(",")
            for colIdx in range(len(cells)):
                item = QTableWidgetItem(cells[colIdx])
                self.tableWidget.setItem(rowIdx, colIdx, item)
            rowIdx += 1

        self.tableWidget.setStyleSheet("QHeaderView::section {font-size:22px;}"
                                       "QTableWidget {font-size:22px;} "
                                       "QTableWidget::item{border-bottom:1px solid #fff; border-right:1px solid #fff;}")
        self.tableWidget.resizeColumnsToContents()
        self.tableWidget.resizeRowsToContents()

        vBox = QVBoxLayout(self)
        vBox.addWidget(self.tableWidget)
        self.setLayout(vBox)

아래는 탭 위젯에 사진 탭, 테이블 탭을 추가한 전체 소스코드 입니다.

1. qt/tabwidget/TabWidget.py

# qt/tabwidget/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")
        self.tabWidget.addTab(TabWidgetB(), "tab2")
        self.tabWidget.setStyleSheet("QTabBar {font-size:30px;}")

        self.label = QLabel(self)
        self.label.setText("Title")
        self.label.setStyleSheet("font-size:40px; font-weight: bold;")
        self.label.setAlignment(Qt.AlignCenter)

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


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 = 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)

class TabWidgetB(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        self.tableWidget = QTableWidget(self)
        self.tableWidget.setMinimumSize(500, 200)
        self.tableWidget.setColumnCount(3)
        self.tableWidget.setHorizontalHeaderLabels(["header-1", "header-2", "header-3"])

        # read data from file
        with open('venv/qt/tabwidget/data/tab.csv', 'r', encoding='utf-8') as f:
            data = f.readlines()

        # Set data to tableWidget
        self.tableWidget.setRowCount(len(data))
        rowIdx = 0
        for line in data:
            cells = line.split(",")
            for colIdx in range(len(cells)):
                item = QTableWidgetItem(cells[colIdx])
                self.tableWidget.setItem(rowIdx, colIdx, item)
            rowIdx += 1

        self.tableWidget.setStyleSheet("QHeaderView::section {font-size:22px;}"
                                       "QTableWidget {font-size:22px;} "
                                       "QTableWidget::item{border-bottom:1px solid #fff; border-right:1px solid #fff;}")
        self.tableWidget.resizeColumnsToContents()
        self.tableWidget.resizeRowsToContents()

        vBox = QVBoxLayout(self)
        vBox.addWidget(self.tableWidget)
        self.setLayout(vBox)

2. main.py

# main.py

from qt.tabwidget.TabWidget import * # 본인의 소스파일이 있는 경로를 적고 import해주세요
import sys

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

if __name__ == '__main__':
    start()

연결된 글 보기 :

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

[PyQt] 스크롤 가능한 영역(ScrollArea)에 사진 추가하기

지난번 탭 다이얼로그에, 글자(라벨)와 사진 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)

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