【Day17】QToolButton 續*3

2022 iThome 鐵人賽

DAY 17

Software Development

[Python QT] 玩玩 Pyside 的各種功能系列第 17 篇

14th鐵人賽 python pyside qt

暱稱

團隊30 個字以內

2022-09-19 23:15:40

746 瀏覽

分享至

今天繼續使用 ToolButton, 既然我們範例都用 Google 文件了, 那我們就在程式中央放 QLineEdit 吧
然後把編輯相關功能加進去, 首先我們先多放一個 QToolButton

如果沒有設定 layout, 直接加 ToolButton 的話會變成下方情形

兩個按鈕重疊了

因此在這裡我們使用 QGridLayout , 中文為網格佈局, 有點像表格那樣的佈局方式
先直接給我在初始函示中的程式碼吧

def __init__(self):
    super().__init__()
    self.num = 0
    layout = QGridLayout()
    self.setLayout(layout)
    self.edit = QLineEdit()
    layout.addWidget(self.edit, 1, 0, 2, 3)

    self.tb = QToolButton(self)
    self.tb.setText("檔案")
    self.tb.setAutoRaise(True)
    self.tb.setStyleSheet("QToolButton::menu-indicator { image: None; }")
    self.tb.setCursor(Qt.PointingHandCursor)
    layout.addWidget(self.tb, 0, 0)
    self.editTB = QToolButton(self)
    self.editTB.setText("編輯")
    self.editTB.setAutoRaise(True)
    self.editTB.setStyleSheet("QToolButton::menu-indicator { image: None; }")
    self.editTB.setCursor(Qt.PointingHandCursor)
    layout.addWidget(self.editTB, 0, 1)
    self.setupFileToolButton()

中途展示

在上方程式碼中可以看到 addWidget 有兩種參數形式

layout.addWidget(self.tb, 0, 0) 就是把 ToolButton 放在 (0, 0) 這個位置
layout.addWidget(self.edit, 1, 0, 2, 3) 則是把 QLineEdit 的頭放在 (1, 0) 這個位置, 上下橫跨兩行, 左右橫跨三行的意思

p.s. 其實我之前一直以為是給 a 點到 b 點的空間...

接下來就是跟昨天一樣, 完成編輯選單內的內容
在這裡提一下 QLineEdit 內建功能, 在文字輸入框按右鍵時會有 Qt 內建的選單, 如下圖

所以我們編輯內的選單的長相打算跟右鍵一樣
下收程式碼

import sys
from PySide6.QtWidgets import *
from PySide6.QtCore import *
from PySide6.QtGui import *

class MyWidget(QWidget):
    def __init__(self):
        super().__init__()
        self.num = 0
        layout = QGridLayout()
        self.setLayout(layout)
        self.edit = QLineEdit()
        layout.addWidget(self.edit, 1, 0, 2, 3)

        self.tb = QToolButton(self)
        self.tb.setText("檔案")
        self.tb.setAutoRaise(True)
        self.tb.setStyleSheet("QToolButton::menu-indicator { image: None; }")
        self.tb.setCursor(Qt.PointingHandCursor)
        layout.addWidget(self.tb, 0, 0)
        self.editTB = QToolButton(self)
        self.editTB.setText("編輯")
        self.editTB.setAutoRaise(True)
        self.editTB.setStyleSheet("QToolButton::menu-indicator { image: None; }")
        self.editTB.setCursor(Qt.PointingHandCursor)
        layout.addWidget(self.editTB, 0, 1)
        self.setupToolButton()

    def setupToolButton(self):
        self.setupFileToolButton()
        self.setupEditToolButton()

    def setupFileToolButton(self):
        menu = QMenu("Menu", self)
        menu.setCursor(Qt.PointingHandCursor)
        newMenu = QMenu("新文件", self)
        newMenu.setIcon(QIcon("icon\document.png"))
        doc = QAction(QIcon("icon\document (1).png"), "文件", self)
        useExample = QAction(QIcon("icon\edit-alt.png"), "使用範本", self)
        newMenu.addAction(doc)
        newMenu.addAction(useExample)
        open = QAction(QIcon("icon\_folder.png"), "開啟", self)
        open.triggered.connect(self.addOne)
        open.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_O))
        open.setShortcutContext(Qt.ApplicationShortcut)
        makeCopy = QAction(QIcon("icon\duplicate.png"), "建立副本", self)
        rename = QAction(QIcon("icon\edit.png"), "重新命名", self)
        move = QAction(QIcon("icon\_book-arrow-right.png"), "移動", self)
        delete = QAction(QIcon("icon\\trash.png"), "移至垃圾桶", self)
        menu.addMenu(newMenu)
        menu.addAction(open)
        menu.addAction(makeCopy)
        menu.addSeparator()
        menu.addAction(rename)
        menu.addAction(move)
        menu.addAction(delete)

        self.tb.setMenu(menu)
        self.tb.setPopupMode(QToolButton.InstantPopup)

    def setupEditToolButton(self):
        menu = QMenu("Menu", self)
        menu.setCursor(Qt.PointingHandCursor)
        undo = QAction(QIcon("icon\\undo-alt.png"), "復原", self)
        undo.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_Z))
        undo.setShortcutContext(Qt.ApplicationShortcut)
        redo = QAction(QIcon("icon\\redo-alt.png"), "取消復原", self)
        redo.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_Y))
        redo.setShortcutContext(Qt.ApplicationShortcut)
        cut = QAction(QIcon("icon\\scissors.png"), "剪下", self)
        cut.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_X))
        cut.setShortcutContext(Qt.ApplicationShortcut)
        copy = QAction(QIcon("icon\\copy.png"), "複製", self)
        copy.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_C))
        copy.setShortcutContext(Qt.ApplicationShortcut)
        paste = QAction("貼上", self)
        paste.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_V))
        paste.setShortcutContext(Qt.ApplicationShortcut)
        delete = QAction(QIcon("icon\\trash.png"), "刪除", self)
        selectAll = QAction("全選", self)
        selectAll.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_A))
        selectAll.setShortcutContext(Qt.ApplicationShortcut)
        menu.addAction(undo)
        menu.addAction(redo)
        menu.addSeparator()
        menu.addAction(cut)
        menu.addAction(copy)
        menu.addAction(paste)
        menu.addAction(delete)
        menu.addSeparator()
        menu.addAction(selectAll)

        self.editTB.setMenu(menu)
        self.editTB.setPopupMode(QToolButton.InstantPopup)

if __name__ == "__main__":
    app = QApplication([])

    widget = MyWidget()
    widget.resize(300, 300)
    widget.show()

    sys.exit(app.exec())

把快捷鍵也都放上去後, 編輯選單長像如下

但是右鍵選單變成了

但是基本編輯快捷鍵還是可以使用
EDIT
但是 ToolButton 現在按下去沒有任何反應
現在要做的事是把 ToolButton 的功能跟 QLineEdit 原有的功能連上

import sys
from PySide6.QtWidgets import *
from PySide6.QtCore import *
from PySide6.QtGui import *

class MyWidget(QWidget):
    def __init__(self):
        super().__init__()
        self.num = 0
        layout = QGridLayout()
        self.setLayout(layout)
        self.edit = QLineEdit()
        layout.addWidget(self.edit, 1, 0, 2, 3)

        self.tb = QToolButton(self)
        self.tb.setText("檔案")
        self.tb.setAutoRaise(True)
        self.tb.setStyleSheet("QToolButton::menu-indicator { image: None; }")
        self.tb.setCursor(Qt.PointingHandCursor)
        layout.addWidget(self.tb, 0, 0)
        self.editTB = QToolButton(self)
        self.editTB.setText("編輯")
        self.editTB.setAutoRaise(True)
        self.editTB.setStyleSheet("QToolButton::menu-indicator { image: None; }")
        self.editTB.setCursor(Qt.PointingHandCursor)
        layout.addWidget(self.editTB, 0, 1)
        self.setupToolButton()

    def setupToolButton(self):
        self.setupFileToolButton()
        self.setupEditToolButton()

    def setupFileToolButton(self):
        menu = QMenu("Menu", self)
        menu.setCursor(Qt.PointingHandCursor)
        newMenu = QMenu("新文件", self)
        newMenu.setIcon(QIcon("icon\document.png"))
        doc = QAction(QIcon("icon\document (1).png"), "文件", self)
        useExample = QAction(QIcon("icon\edit-alt.png"), "使用範本", self)
        newMenu.addAction(doc)
        newMenu.addAction(useExample)
        open = QAction(QIcon("icon\_folder.png"), "開啟", self)
        open.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_O))
        open.setShortcutContext(Qt.ApplicationShortcut)
        makeCopy = QAction(QIcon("icon\duplicate.png"), "建立副本", self)
        rename = QAction(QIcon("icon\edit.png"), "重新命名", self)
        move = QAction(QIcon("icon\_book-arrow-right.png"), "移動", self)
        delete = QAction(QIcon("icon\\trash.png"), "移至垃圾桶", self)
        menu.addMenu(newMenu)
        menu.addAction(open)
        menu.addAction(makeCopy)
        menu.addSeparator()
        menu.addAction(rename)
        menu.addAction(move)
        menu.addAction(delete)

        self.tb.setMenu(menu)
        self.tb.setPopupMode(QToolButton.InstantPopup)

    def setupEditToolButton(self):
        menu = QMenu("Menu", self)
        menu.setCursor(Qt.PointingHandCursor)
        undo = QAction(QIcon("icon\\undo-alt.png"), "復原", self)
        undo.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_Z))
        undo.setShortcutContext(Qt.ApplicationShortcut)
        undo.triggered.connect(self.edit.undo)
        redo = QAction(QIcon("icon\\redo-alt.png"), "取消復原", self)
        redo.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_Y))
        redo.setShortcutContext(Qt.ApplicationShortcut)
        redo.triggered.connect(self.edit.redo)
        cut = QAction(QIcon("icon\\scissors.png"), "剪下", self)
        cut.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_X))
        cut.setShortcutContext(Qt.ApplicationShortcut)
        cut.triggered.connect(self.edit.cut)
        copy = QAction(QIcon("icon\\copy.png"), "複製", self)
        copy.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_C))
        copy.setShortcutContext(Qt.ApplicationShortcut)
        copy.triggered.connect(self.edit.copy)
        paste = QAction("貼上", self)
        paste.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_V))
        paste.setShortcutContext(Qt.ApplicationShortcut)
        paste.triggered.connect(self.edit.paste)
        delete = QAction(QIcon("icon\\trash.png"), "刪除", self)
        selectAll = QAction("全選", self)
        selectAll.setShortcut(QKeySequence(Qt.CTRL + Qt.Key_A))
        selectAll.setShortcutContext(Qt.ApplicationShortcut)
        selectAll.triggered.connect(self.edit.selectAll)
        menu.addAction(undo)
        menu.addAction(redo)
        menu.addSeparator()
        menu.addAction(cut)
        menu.addAction(copy)
        menu.addAction(paste)
        menu.addAction(delete)
        menu.addSeparator()
        menu.addAction(selectAll)

        self.editTB.setMenu(menu)
        self.editTB.setPopupMode(QToolButton.InstantPopup)

if __name__ == "__main__":
    app = QApplication([])

    widget = MyWidget()
    widget.resize(300, 300)
    widget.show()

    sys.exit(app.exec())

沒想到連上原有的功能很簡單
以下展示
edit
用按按鈕的方式達成用快捷鍵就可以完成的事, 哈哈哈哈哈好像多此一舉