syncfusion-winforms-tabbed-mdi-manager

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Implementing Syncfusion Windows Forms TabbedMDIManager

实现Syncfusion Windows Forms TabbedMDIManager

The TabbedMDIManager is a powerful Windows Forms control that provides a modern tabbed interface for Multiple Document Interface (MDI) applications. It replaces the default Cascade/Tiled modes with a professional tabbed layout similar to Visual Studio .NET IDE.
TabbedMDIManager是一款功能强大的Windows Forms控件,为多文档界面(MDI)应用提供现代化的标签式交互界面。它将默认的层叠/平铺布局替换为类似Visual Studio .NET IDE的专业标签式布局。

When to Use This Skill

何时使用本技能

Use this skill whenever you need to:
  • Create tabbed MDI interfaces for desktop applications
  • Organize multiple child windows as tabs
  • Support multiple tab groups with resizable splitters
  • Customize tab appearance, colors, fonts, and styles
  • Apply professional themes (Office 2007/2016, Metro, etc.)
  • Handle tab events and user interactions
  • Save and restore application layout using serialization
  • Configure button controls (close, dropdown)
  • Enable tooltips and context menus
  • Align tabs in different positions (top, bottom, left, right)
当你需要实现以下需求时可使用本技能:
  • 为桌面应用创建标签式MDI界面
  • 将多个子窗口组织为标签形式
  • 支持带可调整大小拆分器的多标签组
  • 自定义标签外观、颜色、字体和样式
  • 应用专业主题(Office 2007/2016、Metro等)
  • 处理标签事件和用户交互
  • 使用序列化保存和恢复应用布局
  • 配置按钮控件(关闭、下拉)
  • 启用工具提示和上下文菜单
  • 支持不同位置的标签对齐(顶部、底部、左侧、右侧)

Component Overview

组件概述

Key Features:
  • ✅ Multiple tab groups with splitter support
  • ✅ 15+ built-in themes and tab styles
  • ✅ Individual and dynamic tab control
  • ✅ Complete customization of colors, fonts, and appearance
  • ✅ Serialization support (XML, Binary, Isolated Storage)
  • ✅ Event-driven architecture
  • ✅ Tooltip and context menu support
  • ✅ Button controls (close button, dropdown)
  • ✅ RTL support
  • ✅ Tab alignment (Top, Bottom, Left, Right)
核心特性:
  • ✅ 支持带拆分器的多标签组
  • ✅ 15+内置主题和标签样式
  • ✅ 独立动态标签控制
  • ✅ 颜色、字体和外观的完全自定义
  • ✅ 序列化支持(XML、Binary、独立存储)
  • ✅ 事件驱动架构
  • ✅ 工具提示和上下文菜单支持
  • ✅ 按钮控件(关闭按钮、下拉按钮)
  • ✅ RTL支持
  • ✅ 标签对齐(顶部、底部、左侧、右侧)

Documentation Navigation Guide

文档导航指南

Getting Started

入门指南

📄 Read: references/getting-started.md
  • Installation and NuGet package setup
  • Assembly references required
  • Adding control via designer and code
  • Creating first MDI child form
  • Attaching to MDI container
  • Basic usage patterns
📄 阅读: references/getting-started.md
  • 安装和NuGet包设置
  • 所需的程序集引用
  • 通过设计器和代码添加控件
  • 创建第一个MDI子窗体
  • 绑定到MDI容器
  • 基础使用模式

Tab Alignment & Positioning

标签对齐与定位

📄 Read: references/tab-alignment.md
  • Align tabs to Top, Bottom, Left, or Right
  • TabControlAdded event usage
  • Positioning tabs in different orientations
  • Changing alignment dynamically
📄 阅读: references/tab-alignment.md
  • 将标签对齐到顶部、底部、左侧或右侧
  • TabControlAdded事件使用方法
  • 不同方向的标签定位
  • 动态修改对齐方式

Tab Groups & Organization

标签组与组织

📄 Read: references/tab-groups.md
  • Creating multiple tab groups
  • Resizing groups with splitters
  • Horizontal and vertical arrangements
  • Controlling number and layout of groups
  • Associating forms with specific tab groups
  • Creating custom tabbed layouts
📄 阅读: references/tab-groups.md
  • 创建多标签组
  • 通过拆分器调整组大小
  • 水平和垂直排列
  • 控制组的数量和布局
  • 将窗体关联到指定标签组
  • 创建自定义标签布局

Button Configuration

按钮配置

📄 Read: references/button-settings.md
  • Dropdown button visibility and styling
  • Close button configuration
  • Individual tab close buttons
  • Middle mouse button click to close
  • Customizing button colors
  • ShowCloseButtonForForm method usage
📄 阅读: references/button-settings.md
  • 下拉按钮可见性和样式设置
  • 关闭按钮配置
  • 单标签关闭按钮
  • 鼠标中键点击关闭
  • 自定义按钮颜色
  • ShowCloseButtonForForm方法使用

Appearance & Styling

外观与样式

📄 Read: references/appearance-and-styling.md
  • Tab text and icon configuration
  • 15+ tab styles (2D, 3D, Office, Metro, etc.)
  • Active/inactive tab colors
  • Custom fonts for tabs
  • Icon sizes and positioning
  • Tab panel customization
  • Border and background colors
📄 阅读: references/appearance-and-styling.md
  • 标签文本和图标配置
  • 15+标签样式(2D、3D、Office、Metro等)
  • 激活/未激活标签颜色
  • 自定义标签字体
  • 图标大小和定位
  • 标签面板自定义
  • 边框和背景色

Tab Styles & Themes

标签样式与主题

📄 Read: references/tab-styles-and-themes.md
  • All available tab styles overview
  • Office 2007/2016 color schemes
  • OneNote and Metro styles
  • IE7 and WhidbeyStyle options
  • Window layout styles (Cascade, Tile, etc.)
  • Switching between styles dynamically
  • Office2007ColorScheme property
📄 阅读: references/tab-styles-and-themes.md
  • 所有可用标签样式概览
  • Office 2007/2016配色方案
  • OneNote和Metro样式
  • IE7和WhidbeyStyle选项
  • 窗口布局样式(层叠、平铺等)
  • 动态切换样式
  • Office2007ColorScheme属性使用

Events & Interaction

事件与交互

📄 Read: references/events-and-interaction.md
  • BeforeMDIChildAdded event
  • TabControlAdded and TabControlAdding events
  • TabControlRemoved event
  • BeforeDropDownPopup event
  • UnLockingMdIClient event
  • Event-driven customization
  • Context menu customization
  • Tooltip support
📄 阅读: references/events-and-interaction.md
  • BeforeMDIChildAdded事件
  • TabControlAdded和TabControlAdding事件
  • TabControlRemoved事件
  • BeforeDropDownPopup事件
  • UnLockingMdIClient事件
  • 事件驱动自定义
  • 上下文菜单自定义
  • 工具提示支持

Serialization & State Management

序列化与状态管理

📄 Read: references/serialization-and-state.md
  • Save tab group layout using AppStateSerializer
  • Load saved layouts on application startup
  • Serialization formats (XML, Binary, Isolated Storage)
  • Memory stream serialization
  • ClearSavedTabGroupState usage
  • Singleton pattern for AppStateSerializer
  • Restoring application state
📄 阅读: references/serialization-and-state.md
  • 使用AppStateSerializer保存标签组布局
  • 应用启动时加载已保存的布局
  • 序列化格式(XML、Binary、独立存储)
  • 内存流序列化
  • ClearSavedTabGroupState使用
  • AppStateSerializer单例模式
  • 恢复应用状态

Quick Start Example

快速入门示例

csharp
// Step 1: Add namespace
using Syncfusion.Windows.Forms.Tools;

// Step 2: Create TabbedMDIManager
TabbedMDIManager tabbedMDIManager = new TabbedMDIManager();

// Step 3: Configure MDI container
this.IsMdiContainer = true;
tabbedMDIManager.AttachToMdiContainer(this);

// Step 4: Apply theme
tabbedMDIManager.ThemesEnabled = true;
tabbedMDIManager.TabStyle = typeof(Syncfusion.Windows.Forms.Tools.TabRendererOffice2016White);

// Step 5: Enable buttons
tabbedMDIManager.CloseButtonVisible = true;
tabbedMDIManager.DropDownButtonVisible = true;

// Step 6: Create child window
Form childForm = new Form() { Text = "Document 1", MdiParent = this };
childForm.Show();
csharp
// Step 1: Add namespace
using Syncfusion.Windows.Forms.Tools;

// Step 2: Create TabbedMDIManager
TabbedMDIManager tabbedMDIManager = new TabbedMDIManager();

// Step 3: Configure MDI container
this.IsMdiContainer = true;
tabbedMDIManager.AttachToMdiContainer(this);

// Step 4: Apply theme
tabbedMDIManager.ThemesEnabled = true;
tabbedMDIManager.TabStyle = typeof(Syncfusion.Windows.Forms.Tools.TabRendererOffice2016White);

// Step 5: Enable buttons
tabbedMDIManager.CloseButtonVisible = true;
tabbedMDIManager.DropDownButtonVisible = true;

// Step 6: Create child window
Form childForm = new Form() { Text = "Document 1", MdiParent = this };
childForm.Show();

Common Patterns

常用模式

Pattern 1: Multiple Tab Groups

模式1:多标签组

csharp
// Create multiple tab groups by using TabbedGroupedMDIManager
TabbedGroupedMDIManager tabbedMDIManager = new TabbedGroupedMDIManager();
tabbedMDIManager.AttachToMdiContainer(this);

// Forms added will be grouped as tabs
Form doc1 = new Form() { Text = "Document 1", MdiParent = this };
Form doc2 = new Form() { Text = "Document 2", MdiParent = this };
doc1.Show();
doc2.Show();
csharp
// Create multiple tab groups by using TabbedGroupedMDIManager
TabbedGroupedMDIManager tabbedMDIManager = new TabbedGroupedMDIManager();
tabbedMDIManager.AttachToMdiContainer(this);

// Forms added will be grouped as tabs
Form doc1 = new Form() { Text = "Document 1", MdiParent = this };
Form doc2 = new Form() { Text = "Document 2", MdiParent = this };
doc1.Show();
doc2.Show();

Pattern 2: Custom Tab Styling

模式2:自定义标签样式

csharp
// Handle TabControlAdded to customize each tab group
tabbedMDIManager.TabControlAdded += (sender, args) =>
{
    args.TabControl.Alignment = TabAlignment.Bottom;
    args.TabControl.Font = new Font("Arial", 10, FontStyle.Bold);
};
csharp
// Handle TabControlAdded to customize each tab group
tabbedMDIManager.TabControlAdded += (sender, args) =>
{
    args.TabControl.Alignment = TabAlignment.Bottom;
    args.TabControl.Font = new Font("Arial", 10, FontStyle.Bold);
};

Pattern 3: Save & Restore Layout

模式3:保存与恢复布局

csharp
// On application close: Save layout
AppStateSerializer serializer = new AppStateSerializer(SerializeMode.XMLFile, "AppState");
tabbedMDIManager.SaveTabGroupStates(serializer);
serializer.PersistNow();

// On application startup: Load layout
AppStateSerializer serializer = new AppStateSerializer(SerializeMode.XMLFile, "AppState");
tabbedMDIManager.LoadTabGroupStates(serializer);
csharp
// On application close: Save layout
AppStateSerializer serializer = new AppStateSerializer(SerializeMode.XMLFile, "AppState");
tabbedMDIManager.SaveTabGroupStates(serializer);
serializer.PersistNow();

// On application startup: Load layout
AppStateSerializer serializer = new AppStateSerializer(SerializeMode.XMLFile, "AppState");
tabbedMDIManager.LoadTabGroupStates(serializer);

Pattern 4: Custom Context Menu

模式4:自定义上下文菜单

csharp
// Add custom items to tab context menu
using Syncfusion.Windows.Forms.Tools.XPMenus;

ParentBarItem contextMenu = new ParentBarItem();
BarItem customItem = new BarItem() { Text = "Custom Action", MergeOrder = 30 };
contextMenu.Items.Add(customItem);
tabbedMDIManager.ContextMenuItem = contextMenu;
csharp
// Add custom items to tab context menu
using Syncfusion.Windows.Forms.Tools.XPMenus;

ParentBarItem contextMenu = new ParentBarItem();
BarItem customItem = new BarItem() { Text = "Custom Action", MergeOrder = 30 };
contextMenu.Items.Add(customItem);
tabbedMDIManager.ContextMenuItem = contextMenu;

Key Properties Summary

核心属性汇总

PropertyPurposeExample
ThemesEnabled
Enable/disable theme support
tabbedMDIManager.ThemesEnabled = true;
TabStyle
Set tab visual style
typeof(TabRenderer2D)
to
TabRendererOffice2016Black
CloseButtonVisible
Show/hide close button
true
to show close button
DropDownButtonVisible
Show/hide dropdown button
true
to show dropdown
ShowCloseButton
Individual close buttons per tab
true
for per-tab close buttons
ShowCloseButtonForActiveTabOnly
Close button only on active tab
true
to limit to active tab
UseIconsInTabs
Display icons in tab headers
true
to show icons
ImageSize
Size of tab icons
new Size(16, 16)
ActiveTabBackColor
Active tab background
Color.Blue
TabBackColor
Inactive tab background
Color.Gray
ActiveTabFont
Active tab font style
new Font("Arial", 10, FontStyle.Bold)
TabFont
Inactive tab font style
new Font("Arial", 10)
Alignment
Tab position (via TabControl)
TabAlignment.Bottom
,
Left
,
Right
CloseOnMiddleButtonClick
Middle mouse button closes tabs
true
to enable
属性用途示例
ThemesEnabled
启用/禁用主题支持
tabbedMDIManager.ThemesEnabled = true;
TabStyle
设置标签视觉样式
typeof(TabRenderer2D)
TabRendererOffice2016Black
CloseButtonVisible
显示/隐藏关闭按钮
true
表示显示关闭按钮
DropDownButtonVisible
显示/隐藏下拉按钮
true
表示显示下拉按钮
ShowCloseButton
每个标签单独显示关闭按钮
true
表示每个标签都有关闭按钮
ShowCloseButtonForActiveTabOnly
仅在激活标签上显示关闭按钮
true
表示仅激活标签显示关闭按钮
UseIconsInTabs
在标签头显示图标
true
表示显示图标
ImageSize
标签图标大小
new Size(16, 16)
ActiveTabBackColor
激活标签背景色
Color.Blue
TabBackColor
未激活标签背景色
Color.Gray
ActiveTabFont
激活标签字体样式
new Font("Arial", 10, FontStyle.Bold)
TabFont
未激活标签字体样式
new Font("Arial", 10)
Alignment
标签位置(通过TabControl设置)
TabAlignment.Bottom
,
Left
,
Right
CloseOnMiddleButtonClick
鼠标中键点击关闭标签
true
表示启用该功能

Common Use Cases

常见使用场景

Use Case 1: Visual Studio Style MDI

场景1:Visual Studio风格MDI应用

Create a professional MDI application with tabbed layout, multiple tab groups, and VS-like appearance.
创建具备标签布局、多标签组、类似VS外观的专业MDI应用。

Use Case 2: Document Editor

场景2:文档编辑器

Build a multi-document editor with tabs for each open document, themes, and serialization to restore previous session.
构建多文档编辑器,每个打开的文档对应一个标签,支持主题和序列化能力,可恢复上一次会话状态。

Use Case 3: Data Analysis Tool

场景3:数据分析工具

Create an application with multiple analysis tabs, groupable by functionality with custom styling.
创建包含多个分析标签的应用,支持按功能分组、自定义样式。

Use Case 4: Project Management

场景4:项目管理工具

Build a UI with different task tabs, customizable appearance, and persistent layout across sessions.
构建包含不同任务标签的UI,支持外观自定义,跨会话持久化布局。

Next Steps

后续步骤

  1. Start with Getting Started to set up your first TabbedMDI application
  2. Explore Tab Groups if you need multiple resizable document areas
  3. Customize Appearance for professional theming and styling
  4. Add Interactivity with events and context menus
  5. Implement Serialization to save user preferences and layouts
  1. 从入门指南开始,搭建你的第一个TabbedMDI应用
  2. 如果你需要多个可调整大小的文档区域,探索标签组功能
  3. 自定义外观实现专业的主题和样式
  4. 通过事件和上下文菜单添加交互能力
  5. 实现序列化保存用户偏好和布局设置

Additional Resources

额外资源