本系列教程致力于教大家如何創建流行的應用程序UI，這種經典布局包含代表主要工作區域的選項卡式或 MDI 文檔、表單側面的面板和頂部的主菜單，類似于 Microsoft Visual Studio 中的 UI 。

獲取工具下載 - DevExpress WinForm v21.1

DevExpress WinForm擁有180+組件和UI庫，能為Windows Forms平臺創建具有影響力的業務解決方案。DevExpress WinForms能完美構建流暢、美觀且易于使用的應用程序，無論是Office風格的界面，還是分析處理大批量的業務數據，它都能輕松勝任！

本教程將向您展示如何執行以下操作：

• 使用創建傳統的基于文檔的工作區；
• 添加 組件并實現常規或自動隱藏面板；
• 使用組件來管理文檔和面板。

Step 1 - 文檔管理器

在這一步中，您將學習如何使用 Document Manager 組件。

文檔管理器允許您根據相應的視圖(Views)創建選項卡式或 MDI 應用程序 UI，主要的文檔管理器元素是文檔 - 能夠封裝所需內容并基于父視圖顯示的對象。

1. 啟動 Visual Studio，創建一個新的Windows Forms Application項目，然后指定其名稱和位置。

2. 在 Visual Studio 工具箱中找到 DocumentManager 組件并將其拖放到您的表單上。

3. 通過單擊控件右上角的智能標記按鈕調用 DocumentManager 的智能標記，默認情況下，新添加的 DocumentManager 應用了選項卡式視圖。您可以通過相應的‘Convert to…’鏈接將其更改為另一個可用的視圖，默認選項卡式視圖適用于當前示例，因此保持不變并調用 DocumentManager Designer。

4. 切換到設計器中的 ‘Documents’ 部分。

 5. 在Solution Explorer中右鍵單擊您的項目并選擇Add New Item，如下所示。

在顯示的對話框中，選擇User Control并輸入其名稱。

根據您的要求多次重復此步驟，然后將控件添加到每個User Control并根據需要自定義其屬性，確保您的項目編譯沒有錯誤，然后繼續下一步。

6. 您現在擁有多個代表最終用戶工作區的User Control，現在為每個現有的User Control添加一個文檔。 打開設計器并再次轉到Documents部分，如您所見，Populate按鈕現在可用，單擊此按鈕可為項目中的每個User Control添加一個文檔。

請注意，每個文檔都通過 BaseDocument.ControlName 和 BaseDocument.ControlTypeName 屬性與相應的用戶控件相關聯。

7. 最后，處理視圖的 事件并將所需的控件傳遞給每個文檔：

C#

private void tabbedView1_QueryControl(object sender, DevExpress.XtraBars.Docking2010.Views.QueryControlEventArgs e) {
if (e.Document.ControlName == "UserControl1") e.Control = new UserControl1();
else e.Control = new UserControl2();
}

VB.NET

Private Sub tabbedView1_QueryControl(sender As Object, e As DevExpress.XtraBars.Docking2010.Views.QueryControlEventArgs)
If e.Document.ControlName = "UserControl1" Then
e.Control = New UserControl1()
Else
e.Control = New UserControl2()
End If
End Sub

8. 下圖說明了應用 Office 2013 皮膚的結果。

在下一步中，您將學習如何在您的應用程序中結合使用 Document Manager 和 Dock Manager。

DevExpress技術交流群4：715863792      歡迎一起進群討論