進階布局

在前面我們講過了三種的基本佈局垂直佈局(QVBoxLayout)、水平佈局(QHBoxLayout)和格子佈局(QGridLayout)，但除了這三種佈局之外，其實還有很多種佈局，QStackedLayout和QSplitter等佈局。那這次就來介紹一些其他比較常用的佈局。

1. QStackedLayout

QStackedLayout 是一種堆疊式的布局，允許在相同的窗口中，切換不同的Widget，但是一次只能顯示一個。這個布局很適合用來顯示分頁界面。除了使用 QStackedLayout佈局 ，也有 QStackedWidget部件可以使用，裡面自帶了 QWidget 和 QStackedLayout。

• currentIndex() : 獲取當前顯示頁面的索引。
• setCurrentIndex() : 切換到指定的頁面。

範例

下面範例是當把兩個標籤添加堆疊裡面，當按下按鈕後會切換頁面。

from PySide6.QtWidgets import QApplication, QWidget, QStackedLayout, QLabel, QPushButton, QVBoxLayout
class StackedWidgetExample(QWidget):
    def __init__(self):
        super().__init__()

        # 創建 QStackedLayout
        self.stacked_layout = QStackedLayout()

        # 創建兩個頁面
        self.page1 = QLabel("這是第一頁")
        self.page2 = QLabel("這是第二頁")

        # 添加頁面到布局中
        self.stacked_layout.addWidget(self.page1)
        self.stacked_layout.addWidget(self.page2)

        # 創建切換按鈕
        self.button = QPushButton("切換頁面")
        self.button.clicked.connect(self.toggle)

        # 設置主布局
        main_layout = QVBoxLayout()
        main_layout.addLayout(self.stacked_layout)
        main_layout.addWidget(self.button)

        self.setLayout(main_layout)

    def toggle(self):
        # 切換當前顯示頁面
        current_index = self.stacked_layout.currentIndex()
        self.stacked_layout.setCurrentIndex(1 if current_index == 0 else 0)

if __name__ == "__main__":
    app = QApplication([])
    window = StackedWidgetExample()
    window.show()
    app.exec()

2. QSplitter

QSplitter 它允許使用者通過拖動來調整 widget 之間的大小。這在需要展示多個區域且允許動態調整每個區域大小的應用中非常有用。

範例

以下範例展示如何使用 Splitter 創建可調整大小的文本編輯區。

from PySide6.QtWidgets import QApplication, QWidget, QSplitter, QTextEdit, QVBoxLayout

class SplitterExample(QWidget):
    def __init__(self):
        super().__init__()

        # 創建 QSplitter
        self.splitter = QSplitter()

        # 創建兩個文本編輯區
        self.text_edit1 = QTextEdit("左邊文本區")
        self.text_edit2 = QTextEdit("右邊文本區")

        # 添加文本區到 QSplitter 中
        self.splitter.addWidget(self.text_edit1)
        self.splitter.addWidget(self.text_edit2)

        # 設置主布局
        layout = QVBoxLayout()
        layout.addWidget(self.splitter)
        self.setLayout(layout)

if __name__ == "__main__":
    app = QApplication([])
    window = SplitterExample()
    window.show()
    app.exec()

3. QDockWidget

QDockWidget 是一種可停靠的 widget，它可以附加到主窗口的邊緣，或是被拖動並放置在窗口的任意位置。適合用在工具欄的應用場景。

範例

from PySide6.QtWidgets import QApplication, QMainWindow, QDockWidget, QTextEdit
from PySide6.QtCore import Qt

class DockWidgetExample(QMainWindow):
    def __init__(self):
        super().__init__()

        # 創建 QDockWidget
        dock = QDockWidget("停靠窗口", self)

        # 添加文本編輯區到 QDockWidget
        text_edit = QTextEdit("這是可拖動的停靠窗口內容")
        dock.setWidget(text_edit)

        # 添加 QDockWidget 到主視窗
        self.addDockWidget(Qt.RightDockWidgetArea, dock)

        # 設置主視窗的中央 widget
        self.setCentralWidget(QTextEdit("主視窗內容"))

if __name__ == "__main__":
    app = QApplication([])
    window = DockWidgetExample()
    window.show()
    app.exec()