Edited at

PyQt5入門(2)


はじめに

 前回の記事の続きです。PyQt5入門から始まって、テキストボックス付きのウィンドウを作成するところまで行きました。よかったら見てください。

 今回はレイアウトを組み立てるところから始めて、メニュー、表、タブを作るところまで行きます。


PyQt5 absolute position

 PyQt5は、グリッドレイアウトや水平位置、絶対配置などいくつかのレイアウト方法をサポートしている。選ぶべきレイアウトはあなたの好みとアプリケーションの種類によって異なる。

 例えば絶対配置ではウィジェットの位置を完全に生業できるが、それとともに全てのウィジェットの位置を明示的に定義する必要がある。

 ウィジェットはmove(x, y)を使って絶対配置に追加できる。

 以下の例では、move()を使用して絶対配置にウィジェットを配置している。

 これらはinitUI()で設定されたいくつかのプロパティを持つPyQt5のウィンドウ(QMainWindow)に追加される。

 


pyqt5.py

import sys

from PyQt5.QtWidgets import QApplication, QWidget, QMainWindow, QLabel
from PyQt5.QtGui import QIcon

class App(QMainWindow):

def __init__(self):
super().__init__()
self.title = "PyQt absolute positioning - pythonspot.com"
self.left = 10
self.top = 10
self.width = 440
self.height = 280
self.initUI()

def initUI(self):
self.setWindowTitle(self.title)
self.setGeometry(self.left, self.top, self.width, self.height)

label = QLabel("Python", self)
label.move(50,50)

label2 = QLabel("PyQt5", self)
label2.move(100,100)

label3 = QLabel("Examples", self)
label3.move(150,150)

label4 = QLabel("pytonspot.com", self)
label4.move(200,200)

self.show()

if __name__ == "__main__":
app = QApplication(sys.argv)
ex = App()
sys.exit(app.exec_())



PyQt5 menu

 PyQt5でメニューを作成するにはQMainWindowをインポートする必要がある。

 トップメニューはmenuBar()で作成でき、サブメニューはaddMenu(name)で追加できる。

 以下がその例。

mainMenu = self.menuBar() 

fileMenu = mainMenu.addMenu("File")
editMenu = mainMenu.addMenu("Edit")
viewMenu = mainMenu.addMenu("View")
searchMenu = mainMenu.addMenu("Search")
toolsMenu = mainMenu.addMenu("Tools")
helpMenu = mainMenu.addMenu("Help")

 それぞれのボタンは、以下のようにメニューに追加できる。

exitButton = QAction(QIcon("exit24.png"), "Exit", self)

exitButton.setShortcut("Ctrl+Q")
exitButton.setStatusTip("Exit application")
exitButton.triggered.connect(self.close)
fileMenu.addAction(exitButton)

全てのコードは以下のようになる。


pyqt5.py

import sys

from PyQt5.QtWidgets import QMainWindow, QApplication, QWidget, QPushButton, QAction
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import pyqtSlot

class App(QMainWindow):

def __init__(self):
super().__init__()
self.title = "PyQt5 menu - pythonspot.com"
self.left = 10
self.top = 10
self.width = 640
self.height = 400
self.initUI()

def initUI(self):
self.setWindowTitle(self.title)
self.setGeometry(self.left, self.top, self.width, self.height)

mainMenu = self.menuBar()
fileMenu = mainMenu.addMenu("File")
editMenu = mainMenu.addMenu("Edit")
viewMenu = mainMenu.addMenu("View")
searchMenu = mainMenu.addMenu("Search")
toolsMenu = mainMenu.addMenu("Tools")
helpMenu = mainMenu.addMenu("Help")

exitButton = QAction(QIcon("exit24.png"), "Exit", self)
exitButton.setShortcut("Ctrl+Q")
exitButton.setStatusTip("Exit application")
exitButton.triggered.connect(self.close)
fileMenu.addAction(exitButton)

self.show()

if __name__ == "__main__":
app = QApplication(sys.argv)
ex = App()
sys.exit(app.exec_())



PyQt5 table

 ここではPyQt5で表を作る方法を学ぶ。表を追加するにはQTableWidgetとQTableWidgetItemをインポートする必要がある。

from PyQt5.QtWidgets import QTableWidget,QTableWidgetItem

表を追加するにはこうする。

self.tableWidget = QTableWidget()

# set row count
self.tableWidget.setRowCount(4)

# set column count
self.tableWidget.setColumnCount(2)

 それぞれのセルを追加するにはこうする。

self.tableWidget.setItem(X,Y, QTableWidgetItem("TEXT"))

 最終的なコードは以下のようになる。


pyqt5.py

import sys

from PyQt5.QtWidgets import QMainWindow, QApplication, QWidget, QAction, QTableWidget,QTableWidgetItem,QVBoxLayout
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import pyqtSlot

class App(QWidget):

def __init__(self):
super().__init__()
self.title = "PyQt5 table - pythonspot.com"
self.left = 0
self.top = 0
self.width = 300
self.height = 200
self.initUI()

def initUI(self):
self.setWindowTitle(self.title)
self.setGeometry(self.left, self.top, self.width, self.height)

self.createTable()

# Add box layout, add table to box layout and add box layout to widget
self.layout = QVBoxLayout()
self.layout.addWidget(self.tableWidget)
self.setLayout(self.layout)

# Show widget
self.show()

def createTable(self):
# Create table
self.tableWidget = QTableWidget()
self.tableWidget.setRowCount(4)
self.tableWidget.setColumnCount(2)
self.tableWidget.setItem(0,0, QTableWidgetItem("Cell (1,1)"))
self.tableWidget.setItem(0,1, QTableWidgetItem("Cell (1,2)"))
self.tableWidget.setItem(1,0, QTableWidgetItem("Cell (2,1)"))
self.tableWidget.setItem(1,1, QTableWidgetItem("Cell (2,2)"))
self.tableWidget.setItem(2,0, QTableWidgetItem("Cell (3,1)"))
self.tableWidget.setItem(2,1, QTableWidgetItem("Cell (3,2)"))
self.tableWidget.setItem(3,0, QTableWidgetItem("Cell (4,1)"))
self.tableWidget.setItem(3,1, QTableWidgetItem("Cell (4,2)"))
self.tableWidget.move(0,0)

# table selection change
self.tableWidget.doubleClicked.connect(self.on_click)

@pyqtSlot()
def on_click(self):
print("\n")
for currentQTableWidgetItem in self.tableWidget.selectedItems():
print(currentQTableWidgetItem.row(), currentQTableWidgetItem.column(), currentQTableWidgetItem.text())

if __name__ == "__main__":
app = QApplication(sys.argv)
ex = App()
sys.exit(app.exec_())



PyQt5 tabs

 ここではPyQt5でタブを使用する方法を学ぶ。最初に完全なコードを表示してから解説する。

 PyQt5にはQTあbWidgetというタブを作成するウィジェットがある。QTあbWidgetには、ラベルやボタン、イメージなどのウィジェットがあるタブを含めることができる。

 まず、これが完全なコードだ。


pyqt5.py

import sys

from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton, QWidget, QAction, QTabWidget,QVBoxLayout
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import pyqtSlot

class App(QMainWindow):

def __init__(self):
super().__init__()
self.title = "PyQt5 tabs - pythonspot.com"
self.left = 0
self.top = 0
self.width = 300
self.height = 200
self.setWindowTitle(self.title)
self.setGeometry(self.left, self.top, self.width, self.height)

self.table_widget = MyTableWidget(self)
self.setCentralWidget(self.table_widget)

self.show()

class MyTableWidget(QWidget):

def __init__(self, parent):
super(QWidget, self).__init__(parent)
self.layout = QVBoxLayout(self)

# Initialize tab screen
self.tabs = QTabWidget()
self.tab1 = QWidget()
self.tab2 = QWidget()
self.tabs.resize(300,200)

# Add tabs
self.tabs.addTab(self.tab1,"Tab 1")
self.tabs.addTab(self.tab2,"Tab 2")

# Create first tab
self.tab1.layout = QVBoxLayout(self)
self.pushButton1 = QPushButton("PyQt5 button")
self.tab1.layout.addWidget(self.pushButton1)
self.tab1.setLayout(self.tab1.layout)

# Add tabs to widget
self.layout.addWidget(self.tabs)
self.setLayout(self.layout)

@pyqtSlot()
def on_click(self):
print("\n")
for currentQTableWidgetItem in self.tableWidget.selectedItems():
print(currentQTableWidgetItem.row(), currentQTableWidgetItem.column(), currentQTableWidgetItem.text())

if __name__ == "__main__":
app = QApplication(sys.argv)
ex = App()
sys.exit(app.exec_())


 次に、表をウィンドウに追加するために新しいクラスを作成する。

class MyTableWidget(QWidget)

 タブ画面を初期化するには、QTabWidgetとタブ用の2つのQWidgetを作成する。

self.tabs = QTabWidget()

self.tab1 = QWidget()
self.tab2 = QWidget()
self.tabs.resize(300,200)

 次に、これらのタブをタブウィジェットに追加する。

self.tabs.addTab(self.tab1, "Tab1")

self.tabs.addTab(self.tab2, "Tab2")

 タブのコンテンツは、以下を使用して作成される。

self.tab1.layout = QVBoxLayout(self)

self.pushButton1 = QPushButton("PyQt5 button")
self.tab1.layout.addWidget(self.pushButton1)
self.tab1.setLayout(self.tab1.layout)

 最後に、ウィジェットにタブを追加する。

self.layout.addWidget(self.tabs)

self.setLayout(self.layout)

また、カスタムタブウィジェットをウィンドウに追加することを忘れないようにすること。

self.table_widget = MyTableWidget(self)

self.setCentralWidget(self.table_widget)


終わりに

 今回はここまでです。見てくださってありがとうございました。