C++ Qt開發：MdiArea多窗體元件

lyshark發表於2023-12-19

Qt 是一個跨平臺C++圖形介面開發庫，利用Qt可以快速開發跨平臺窗體應用程式，在Qt中我們可以透過拖拽的方式將不同元件放到指定的位置，實現圖形化開發極大的方便了開發效率，本章將重點介紹MdiArea`元件的常用方法及靈活運用。

QMdiArea（Multiple Document Interface Area）是Qt中用於建立多文件介面的元件。它提供了一種在單個視窗中管理多個文件的方式，每個文件通常是一個子視窗（QMdiSubWindow）。該元件主要用於設計多文件介面應用程式，具備有多種窗體展示風格，實現了在父窗體中內嵌多種子窗體的功能，使開發者能夠輕鬆地建立支援多個文件的應用程式。

下面是一些常用的QMdiArea的方法，說明並概述成表格：

方法	說明
`QMdiArea(QWidget *parent = nullptr)`	建構函式，建立一個QMdiArea例項。
`addSubWindow(QWidget *widget, Qt::WindowFlags flags = Qt::WindowFlags())`	將指定的QWidget新增為QMdiArea的子視窗。
`cascadeSubWindows()`	將所有子視窗進行層疊排列。
`tileSubWindows()`	平鋪排列所有子視窗。
`closeAllSubWindows()`	關閉所有子視窗。
`setBackground(const QBrush &background)`	設定QMdiArea的背景色或背景圖片。
`setViewMode(QMdiArea::ViewMode mode)`	設定子視窗排列模式，例如`QMdiArea::SubWindowView`或`QMdiArea::TabbedView`。
`setTabsClosable(bool closable)`	設定子視窗標籤是否可關閉。
`setTabsMovable(bool movable)`	設定子視窗標籤是否可移動。
`setTabShape(QTabWidget::TabShape shape)`	設定子視窗標籤的形狀，例如`QTabWidget::Rounded`或`QTabWidget::Triangular`。
`setDocumentMode(bool enabled)`	設定是否以文件模式顯示子視窗標籤。
`setTabPosition(QTabWidget::TabPosition position)`	設定子視窗標籤的位置，例如`QTabWidget::North`或`QTabWidget::South`。
`setActivationOrder(QMdiArea::ActivationOrder order)`	設定子視窗的啟用順序，例如`QMdiArea::StackingOrder`或`QMdiArea::CreationOrder`。
`setTabbedView(bool tabbed)`	將QMdiArea設定為標籤檢視，即子視窗以標籤頁的形式顯示。
`setOption(QMdiArea::AreaOption option, bool on = true)`	設定QMdiArea的選項，例如`QMdiArea::DontMaximizeSubWindowOnActivation`。
`activeSubWindow()`	返回當前啟用的子視窗，如果沒有啟用的子視窗則返回nullptr。
`closeActiveSubWindow()`	關閉當前啟用的子視窗。

這只是一些常用方法的概述，實際上QMdiArea提供了更多的方法和選項，以滿足不同應用場景的需求。開發者可以根據具體需求查閱官方文件獲取更詳細的資訊。

讀者在使用MDI元件時，需要在UI介面中增加mdiArea控制元件容器，之後所有窗體建立與操作都要在容器內進行，其次由於MDI窗體元件僅僅是一個畫布只具備限制視窗的作用，無法實現生成窗體，所以需要在專案中手動增加自定義Dialog對話方塊，並對該對話方塊進行一定的定製，首先繪製如下案例，其頂部是一個QToolBar元件，底部則是一個QMidArea元件，如下圖；

接著我們需要以此對上述選單繫結一個唯一的名稱及文字，這個過程可以透過程式碼實現，也可以透過圖形化配置，如下圖我們直接透過圖形化模式增加其功能；

1.1 初始化控制元件

如下程式碼，使用QMdiArea建立多文件介面的MainWindow類的建構函式和解構函式。

下面是一些關鍵點的概述：

QMdiArea設定為中央視窗：
- this->setCentralWidget(ui->mdiArea); 將QMdiArea設定為主視窗的中央視窗，表示主要的工作區域將由QMdiArea管理。
主視窗最大化顯示（註釋部分）：
- this->setWindowState(Qt::WindowMaximized); 這是一行註釋掉的程式碼，表示將主視窗設定為最大化顯示。你可以根據需要取消註釋，以便在啟動應用程式時視窗最大化。
工具欄設定：
- ui->mainToolBar->setToolButtonStyle(Qt::ToolButtonTextUnderIcon); 設定工具欄按鈕的顯示風格為圖示下方顯示文字。這種設定在工具欄上同時顯示圖示和文字，提供了更直觀的使用者介面。
子視窗模式設定：
- ui->mdiArea->setViewMode(QMdiArea::SubWindowView); 將QMdiArea的檢視模式設定為子視窗模式。在子視窗模式下，QMdiArea管理並顯示各個子視窗，允許使用者同時檢視和編輯多個文件。
解構函式：
- 解構函式中執行了 delete ui;，確保在物件銷燬時釋放與ui相關的資源，避免記憶體洩漏。

這段程式碼片段展示了一個使用QMdiArea建立多文件介面的主視窗類的基本結構和初始化設定。在這個視窗中，使用者可以開啟和管理多個子視窗，每個子視窗可以包含一個獨立的文件。

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    this->setCentralWidget(ui->mdiArea);

    // 視窗最大化顯示
    // this->setWindowState(Qt::WindowMaximized);
    ui->mainToolBar->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);

    // 子視窗模式
    ui->mdiArea->setViewMode(QMdiArea::SubWindowView);
}

MainWindow::~MainWindow()
{
    delete ui;
}

程式開啟後可以看到如下圖所示的介面；

1.2 新建與關閉窗體

新建窗體時只需要呼叫new Dialog建立新的窗體，並透過addSubWindow()將新的窗體指標加入到元件內即可，當關閉時可以直接透過呼叫closeAllSubWindows()來實現，如下程式碼則是建立與關閉的實現。

// 新建窗體
void MainWindow::on_actionOpen_triggered()
{
    // 建立Dialog窗體
    Dialog *formDoc = new Dialog(this);

    // 文件視窗新增到MDI
    ui->mdiArea->addSubWindow(formDoc);

    // 在單獨的視窗中顯示
    formDoc->show();
}

// 關閉全部
void MainWindow::on_actionClose_triggered()
{
    // 關閉所有子視窗
    ui->mdiArea->closeAllSubWindows();
}

執行後可以點選開啟窗體建立，這個建立是無限制的，如下圖；

1.3 轉換窗體模式

針對模式的轉換此處提供了三種模式，分別是MDI模式、級聯模式及平鋪模式，三種模式的實現只需要呼叫不同的介面即可實現，程式碼如下所示；

// 轉為MDI模式
void MainWindow::on_actionMID_triggered(bool checked)
{
    // Tab多頁顯示模式
    if (checked)
    {
        // Tab多頁顯示模式
        ui->mdiArea->setViewMode(QMdiArea::TabbedView);
        // 頁面可關閉
        ui->mdiArea->setTabsClosable(true);
        ui->actionLine->setEnabled(false);
        ui->actionTile->setEnabled(false);
    }
    // 子視窗模式
    else
    {
        // 子視窗模式
        ui->mdiArea->setViewMode(QMdiArea::SubWindowView);
        ui->actionLine->setEnabled(true);
        ui->actionTile->setEnabled(true);
    }
}

// 恢復預設模式
void MainWindow::on_actionWindow_triggered()
{
    ui->mdiArea->setViewMode(QMdiArea::SubWindowView);
    ui->actionLine->setEnabled(true);
    ui->actionMID->setEnabled(true);
    ui->actionTile->setEnabled(true);
}

// 級聯模式
void MainWindow::on_actionLine_triggered()
{
    ui->mdiArea->cascadeSubWindows();
}

// 平鋪模式
void MainWindow::on_actionTile_triggered()
{
    ui->mdiArea->tileSubWindows();
}

子視窗模式（QMdiArea::SubWindowView）