【続】【PyQt6】【サンプル】QToolBar（モダンなツールバーをできるだけ簡潔に実装する） part 2

はじめに

前回の続きです。
touch-sp.hatenablog.com


一番上のアイコン「Menu」を押すとツールバーが展開されるようにしました。


右のボタンがちゃんと伸縮しています。

サンプルスクリプト

from PyQt6.QtCore import Qt, QSize
from PyQt6.QtWidgets import QApplication, QMainWindow, QToolBar, QPushButton, QVBoxLayout, QWidget, QToolButton
from PyQt6.QtGui import QIcon

toolbar_items = [
    { 'name': 'Menu', 'icon': './icon/menu.svg'},
    { 'name': 'Home', 'icon': './icon/home.svg'},
    { 'name': 'Settings', 'icon': './icon/settings.svg'},
    { 'name': 'Exit', 'icon': './icon/x-circle.svg'},
]

class Window(QMainWindow):
    def __init__(self):
        super().__init__()
        
        self.openMenu = False
        self.setFixedSize(QSize(600, 300))

        self.toolbar = QToolBar()
        self.toolbar.setIconSize(QSize(32,32))
        self.toolbar.setStyleSheet("QToolBar {background: rgb(51, 51, 51); spacing: 10px;}")
        self.addToolBar(Qt.ToolBarArea.LeftToolBarArea, self.toolbar)
        self.toolbar.setMovable(False)
        
        self.toolbuttons = []
        for each_item in toolbar_items:
            self.toolbuttons.append(QToolButton())
            self.toolbuttons[-1].setText(each_item.get('name'))
            self.toolbuttons[-1].setIcon(QIcon(each_item.get('icon')))
            self.toolbuttons[-1].setStyleSheet("QToolButton {color: white; font: 16px; font-weight: bold}")
            self.toolbuttons[-1].clicked.connect(self.pushToolButton)
            self.toolbar.addWidget(self.toolbuttons[-1])
        
        layout = QVBoxLayout()
        layout.addWidget(QPushButton('sample button1'))
        layout.addWidget(QPushButton('sample button2'))

        mainwidget = QWidget()
        mainwidget.setLayout(layout)

        self.setCentralWidget(mainwidget)
        
    def pushToolButton(self):

        match self.sender().text():
            case "Menu":
                self.openMenu = not self.openMenu
                if self.openMenu == True:    
                    for each_toolbutton in self.toolbuttons:
                        each_toolbutton.setToolButtonStyle(Qt.ToolButtonStyle.ToolButtonTextBesideIcon)
                else:
                    for each_toolbutton in self.toolbuttons:
                        each_toolbutton.setToolButtonStyle(Qt.ToolButtonStyle.ToolButtonIconOnly)
            case _:
                None

if __name__ == "__main__":
    app = QApplication([])
    ex =Window()
    ex.show()
    app.exec()

ポイント

QToolBarにQToolButtonをセットしました。

QToolButtonにはアイコンとテキストがセットできます。

setToolButtonStyleによってアイコンだけ表示、両方表示など変更可能です。

アイコンのダウンロード

アイコン画像はこちらのものを使わせて頂きました。
feathericons.com
ダウンロードの際にcolorを「#FFFFFF」に設定しておくと白いアイコンがダウンロードできます。

動作環境

Windows 11
Python 3.10.4

PyQt6==6.3.0
PyQt6-Qt6==6.3.0
PyQt6-sip==13.3.1

PyInstallerでexe化

pyinstaller 5.0.1で問題なくexe化できました。

ただし「icon」フォルダを作成したexeファイルと同じフォルダに配置する必要があります。

PySide6で実行

import部分を変更するだけで問題なく動作します。

from PySide6.QtCore import Qt, QSize
from PySide6.QtWidgets import QApplication, QMainWindow, QToolBar, QPushButton, QVBoxLayout, QWidget, QToolButton
from PySide6.QtGui import QIcon

PySide6==6.3.0
PySide6-Addons==6.3.0
PySide6-Essentials==6.3.0
shiboken6==6.3.0

実用例

実際に使用してみました。
touch-sp.hatenablog.com