界面设计

您需要高效学习，找工作？点击咨询报名实战班

点击查看学员就业情况

点击这里，边看视频讲解，边学习以下内容

开发图形界面应用的时候，重点之一，当然就是 界面设计

界面布局 (Layout)

从前面一章的例子中我们发现，界面开发，好像很简单：就是先了解各个控件的作用，然后拖拽摆放你需要的控件。

但我们发现如果窗体大小变化，控件没有相应的缩放，就会显得很不美观。

这里就需要我们学习界面设计的重点：界面布局 (Layout)

在 WinForms 中，实现控件随窗口缩放而自动调整的响应式布局，主要依赖 Dock 和 Anchor 属性，以及 FlowLayoutPanel 和 TableLayoutPanel 这两个布局容器。

Anchor 属性

Anchor 属性定义了控件的边缘与父容器边缘的相对距离。

设定了 Anchor 属性后，控件会在父容器缩放时， 相对于设计时的情况， 保持该控件和父容器指定边缘的距离不变。

Anchor 属性可以设置为多个边界的组合，比如 Top, Left， Top, Left, Right， Top, Left, Right, Bottom 等等

如下图所示：

中间的这个All 是 Anchor 属性设置为 Top, Left, Right, Bottom，表示控件在父容器缩放时，始终保持与四个边的距离不变。

默认情况下，控件锚定在左上角 (Top, Left)。
如果你希望控件在窗口水平缩放时也跟着变宽，就把它同时锚定到 Left 和 Right。
如果你希望控件在窗口垂直缩放时也跟着变高，就把它同时锚定到 Top 和 Bottom。
如果你希望一个按钮始终停留在某个角落，就设定该角落对应的2个边作为锚点

比如，右下角，就把它锚定到 Bottom, Right。

前面的例子程序：

输入框在左，按钮在右，输入框应该为：Top, Bottom, Left, Right 按钮应该为：Right

输入框在左，按钮在右上，输入框应该为：Top, Bottom, Left, Right 按钮应该为：Right，Up

输入框在上面，按钮在下面，输入框应该为：Top, Bottom, Left, Right 按钮应该为：Bottom

Anchor属性经常和 MinimumSize、MaximumSize 属性一起使用，以确保控件在缩放时保持合适的大小。

比如：前面的例子程序，

输入框在上面，按钮在下面，窗体缩小太多，可能会导致输入框消失，可以指定输入框 MinimumSize 400，200

指定窗体 MinimumSize 500， 470

Dock 属性

Dock（停靠）: Dock 属性让控件完全填充父容器的某一个边缘（上、下、左、右）或剩余的全部空间 (Fill)。

一旦新设定 Dock 属性，Anchor 属性将被忽略。

Dock 属性可以设置为以下值：

Top: 停靠在父容器的顶部。
Bottom: 停靠在父容器的底部。
Left: 停靠在父容器的左侧。
Right: 停靠在父容器的右侧。
Fill: 填充整个父容器的剩余空间。
None: 不停靠，允许手动调整位置和大小。

比如，Dock 属性值设置为 Bottom，就意味着：

- 控件停靠在父容器的底部，
- 扩展个控件宽度到父容器的宽度。

这时候我们没法手工（拖拽）设置它的宽度，margin等都没有效果，因为它的宽度已经由dock策略决定了。

但是我们却可以设置控件的高度，因为 `Dock` 值为 `Bottom` 或者 `top` 时，高度并不受策略限制。

前面的例子程序：

输入框在上，按钮在下，

输入框为： Dock Fill
按钮为： Dock Bottom， 调整 按钮的高度为 35px

当多个控件停靠在同一父容器中时，它们会按照 Z-order (Z顺序) 依次排列。

Z-order 可以通过上下文菜单的 Bring to Front 和 Send to Back 来调整。也可以通过 Document Outline 窗口来调整控件的次序。

Dock 对于创建主次分明的布局（如导航栏、状态栏和主内容区）非常有用。通常会使用 Panel 控件作为容器来组合使用 Dock。

容器控件

容器（container） 控件，是 WinForms 中用于组织和管理控件布局的特殊控件。

在 Visual Studio 的 Toolbox 中，容器控件放在 Container 类别中。

常用的布局容器有：

Panel

Panel 是最基本的容器控件，可以用来组织其他控件。它可以通过 Dock 属性停靠在窗体的任意边缘，或者使用 Anchor 属性来控制其大小和位置。

可以设置背景色、边框样式等。
通常用于分组相关控件，或者作为其他布局容器的父容器。

TableLayoutPanel

TableLayoutPanel 非常常用，它将区域划分为 行和列，形成一个网格，控件可以放置在任意单元格中。

一般我做复杂界面的顶级区域设置，都会使用 TableLayoutPanel，比如典型的网站布局，如下

就是 3行2列的网格布局，左侧是导航栏，右侧是内容区，顶部是标题栏，底部是页脚。

TableLayoutPanel 特点如下：

可以拖动控件放入目标单元格中；
一个网格只能放一个控件。如果需要放多个，可以先放一个容器父控件，里面放多个子控件。
一旦放入某个单元格，并且Dock设置为Fill，就不好再拖放到别的单元格，这时可以先修改为None，再拖拽。或者通过该控件的属性设置 Layout 分类里面的 Row 和 Column 进行调整。
可以通过该控件的属性设置 Layout 分类里面的 RowSpan 和 ColumnSpan 来设置控件跨越的行数和列数。
可以设置行和列的缩放行为（绝对像素、百分比或根据内容自动调整）。

设置可以在属性窗口的 Rows 和 Columns 中进行。
非常适合创建复杂的表单布局，或者需要精确对齐的界面。

比如注册/登录界面, 设置项界面等等

SplitContainer

SplitContainer 允许用户通过拖动分隔条来调整两个子控件的大小。

可以设置水平或垂直分割，适用于需要动态调整布局的场景。

比如上面网页布局的左侧导航栏和右侧内容区，可以使用 SplitContainer 来实现。

可以设置 Orientation 属性来选择水平或垂直分割。

Layout -> Splitter Width 可以设置 分割线宽度。

要设置分割线的颜色比较麻烦一些，不能直接设置。可以设置整个 SplitContainer的背景色为你需要的分割线颜色，然后设置每个子Panel 的 背景色为不同的颜色（比如白色）。

如果你分隔的超过2个分区，可以嵌套使用 SplitContainer

Dock 属性设置为 Fill的控件不能在设计器中拖动到 SplitContainer 中，可以在Document Outline 窗口中拖动。

TabControl

TabControl 用于创建选项卡式界面。它允许在同一窗口中组织多个页面，每个页面可以包含不同的控件和布局。

可以通过添加 TabPage 来创建新的选项卡。
每个选项卡可以有自己的布局和控件，适合需要分组显示内容的场景。
通过 Behavior -> TabPages 属性可以添加/删除/修改标签页。
通过 Behavior -> Alignment 属性可以设置选项卡标签在 上下左右 的位置。
通过 Behavior -> Appearance 属性可以设置选项卡标签的外观（如 Normal, Buttons, FlatButtons 等）。
通过 Behavior -> Padding 属性可以设置选项卡标签的距离

FlowLayoutPanel

FlowLayoutPanel 会将其中的控件按照指定的方向（从左到右、从右到左、从上到下或从下到上）依次排列。当一行或一列空间不足时，它会自动换行/换列。

适合用来展示一组内容，比如商品列表、图片库等内容。

FlowLayoutPanel 的主要作用是作为布局容器，它会自动排列你添加到其中的子控件（比如 Button, Label, PictureBox 等）:

FlowDirection 属性可以设置为 LeftToRight (水平布局) 或 TopDown (垂直布局)。
可以设置 WrapContents 属性来控制是否自动换行/换列。
如果要设置控件的间距，可以设置控件的 Margin 属性。
通过代码添加控件，使用 Controls.Add() 方法，比如

flowLayoutPanel1.Controls.Add(new Button { Text = "按钮1" });
flowLayoutPanel1.Controls.Add(new Button { Text = "按钮2" });

如果要清空里面的控件，可以使用 Controls.Clear() 方法。

通常要添加的控件都是动态的，比如从数据库中获取的商品列表，或者从文件中读取的图片列表。

这些数据源往往是一个 List<T>、DataTable 或其他集合类型。

要实现根据数据源动态创建控件并添加到 FlowLayoutPanel 中，你需要手动编写代码来完成这个过程。基本步骤如下：

遍历你的数据源（例如 List<T>、DataTable 或其他集合）。
在循环中，为每一个数据项创建一个或多个新的控件实例。
将当前数据项的信息赋值给新创建控件的属性（如 Text, Image, Tag 等）。
将新创建的控件添加到 FlowLayoutPanel 的 Controls 集合中。

假设你有一个字符串列表，想为每个字符串创建一个按钮并显示在 FlowLayoutPanel 中。

// 你的数据源
List<string> categories = new List<string> { "Electronics", "Books", "Clothing", "Home & Kitchen", "Sports" };

// 获取 FlowLayoutPanel 控件的引用 (假设在设计器中已命名为 flowLayoutPanel1)
// this.flowLayoutPanel1

// 清空面板中现有的所有控件，以防重复添加
this.flowLayoutPanel1.Controls.Clear();

// 遍历数据源
foreach (string categoryName in categories)
{
    // 1. 创建一个新的 Button 控件
    Button btn = new Button();

    // 2. 设置按钮的属性
    btn.Text = categoryName;
    btn.Tag = categoryName; // 可以用 Tag 属性存储相关数据
    btn.AutoSize = true;   // 让按钮大小自适应内容
    btn.Margin = new Padding(5); // 设置一些外边距，让布局更好看

    // (可选) 为按钮添加点击事件
    btn.Click += (sender, e) => {
        Button clickedButton = sender as Button;
        MessageBox.Show($"You clicked on: {clickedButton.Tag}");
    };

    // 3. 将创建的按钮添加到 FlowLayoutPanel 中
    this.flowLayoutPanel1.Controls.Add(btn);
}

如果每个数据项需要显示的布局比较复杂（例如，一张图片 + 一个标题 + 一段描述），最佳实践是：

创建一个自定义 UserControl，在其中设计好单个数据项的布局（比如包含一个 PictureBox 和两个 Label）。
为这个 UserControl 创建一个公共方法或属性，用于接收数据并更新其内部的控件。
在主窗体的循环中，创建这个 UserControl 的实例，调用方法或属性填充数据，然后将其添加到 FlowLayoutPanel 中。

这种方式能让你的代码结构更清晰、更易于维护。

控件样式

WinForms 没有像 Web CSS 那样的样式表（Stylesheet）系统。在 WinForms 中，控件的外观和感觉（Look and Feel）是通过直接设置其属性来实现的。这可以通过两种主要方式完成：

设计时 (Design-Time): 在 Visual Studio 的 属性 (Properties) 窗口中直观地设置。这是最常用、最便捷的方式。
运行时 (Run-Time): 在代码中动态地修改属性。这为实现动态样式、响应用户交互等提供了灵活性。

核心样式属性

以下是一些最常用的，用于控制控件外观和布局的属性：

样式概念	WinForms 属性	说明
外观
文本颜色	`ForeColor`	设置控件的前景色，通常是文本、边框等元素的颜色。
背景色	`BackColor`	设置控件的背景色。
背景图	`BackgroundImage`	设置控件的背景图片。
背景图布局	`BackgroundImageLayout`	控制背景图的平铺、拉伸、居中等方式。
字体	`Font`	一个复合属性，可以设置字体名称、大小、样式（粗体、斜体、下划线等）。
边框样式	`BorderStyle`	某些控件（如 `Panel`, `TextBox`, `Label`）有此属性，可设为 `None`, `FixedSingle`, `Fixed3D`。
平面样式	`FlatStyle`	按钮类控件特有，用于创建更现代的外观，可选值包括 `Flat`, `Popup`, `Standard`, `System`。
布局
外边距	`Margin`	控件外部的空间，定义其与相邻元素的最小距离。
内边距	`Padding`	控件内部的空间，定义其边框与内容（如文本）之间的距离。
大小	`Size`	一个复合属性，包含 `Width` 和 `Height`，定义控件的尺寸。
定位	`Location`	一个复合属性，包含 `X` 和 `Y`，定义控件左上角相对于其父容器的位置。
停靠	`Dock`	将控件停靠到其父容器的某条边（上/下/左/右）或填充整个剩余空间。
锚定	`Anchor`	使控件在父容器大小改变时，能与其父容器的边框保持固定的相对距离。

Margin 与 Padding

Margin 和 Padding 是布局中至关重要的两个属性，它们共同决定了控件周围的空白区域。

Margin (外边距): 定义控件 边框以外 的空间。它负责将当前控件与其他控件推开。
Padding (内边距): 定义控件 边框以内 的空间。它负责将控件的内部内容（如文本或图像）与边框隔开。

下图清晰地展示了 Margin 和 Padding 的区别：

在 Visual Studio 设计器中，当你拖动控件时，会自动显示对齐线（snaplines），这些线就是基于 Margin 属性来帮助你快速对齐控件，保持一致的间距。

在代码中设置样式

几乎所有在属性窗口中能设置的样式，都可以在代码中进行修改。这通常在窗体的构造函数、Load 事件处理函数或响应其他事件时完成。

// 示例：在 Form_Load 事件中初始化按钮样式
private void MyForm_Load(object sender, EventArgs e)
{
    // 设置按钮的样式
    myButton.Text = "Click Me";
    myButton.BackColor = Color.CornflowerBlue;
    myButton.ForeColor = Color.White;
    myButton.Font = new Font("Microsoft YaHei UI", 10, FontStyle.Bold);
    myButton.Size = new Size(150, 40);

    // 设置边距和内边距 (需要 System.Windows.Forms.Padding 对象)
    myButton.Margin = new Padding(10); // 四周外边距均为10
    myButton.Padding = new Padding(5);  // 四周内边距均为5

    // 设置面板的边框
    myPanel.BorderStyle = BorderStyle.FixedSingle;
    myPanel.BackColor = Color.WhiteSmoke;
}

模拟 CSS 选择器和伪状态

虽然 WinForms 没有原生的 CSS 引擎，但我们可以通过编写代码来模拟其核心概念，实现更高级和可维护的样式管理。

模拟选择器

类型选择器 (Type Selector): 应用样式到所有同类型的控件。可以通过递归遍历窗体上的所有控件来实现。

// 递归地将所有 Button 的背景色设为灰色
private void ApplyStyleToAllButtons(Control container)
{
    foreach (Control ctrl in container.Controls)
    {
        if (ctrl is Button)
        {
            ctrl.BackColor = Color.Gray;
        }

        // 如果控件还有子控件（例如 Panel），则递归调用
        if (ctrl.HasChildren)
        {
            ApplyStyleToAllButtons(ctrl);
        }
    }
}

// 在 Form_Load 中调用
// ApplyStyleToAllButtons(this);

“类”选择器 (Class Selector): CSS 中使用类（class）来标记应用相同样式的元素。

在 WinForms 中，可以巧妙地利用 Tag 属性来模拟。Tag 属性是 object 类型，可以存储任何信息。

// 1. 在设计器或代码中为控件“打标签”
primaryButton.Tag = "PrimaryButton";
secondaryButton.Tag = "SecondaryButton";
cancelButton.Tag = "SecondaryButton";

// 2. 编写一个方法来应用样式
private void ApplyStylesByTag(Control container)
{
    foreach (Control ctrl in container.Controls)
    {
        if (ctrl.Tag is string tag)
        {
            switch (tag)
            {
                case "PrimaryButton":
                    ctrl.BackColor = Color.FromArgb(0, 123, 255);
                    ctrl.ForeColor = Color.White;
                    break;
                case "SecondaryButton":
                    ctrl.BackColor = Color.Gray;
                    ctrl.ForeColor = Color.Black;
                    break;
            }
        }
        if (ctrl.HasChildren)
        {
            ApplyStylesByTag(ctrl);
        }
    }
}

模拟伪状态

伪状态（如 :hover, :active）描述了控件因用户交互而进入的特殊状态。这需要通过订阅控件的事件来模拟。

:hover (悬停): 使用 MouseEnter 和 MouseLeave 事件。

private void button_MouseEnter(object sender, EventArgs e)
{
    if (sender is Button btn)
    {
        btn.BackColor = Color.DarkBlue; // 鼠标进入时变色
    }
}

private void button_MouseLeave(object sender, EventArgs e)
{
    if (sender is Button btn)
    {
        btn.BackColor = Color.CornflowerBlue; // 鼠标离开时恢复
    }
}

:active (激活): 使用 MouseDown 和 MouseUp 事件。

private void button_MouseDown(object sender, MouseEventArgs e)
{
    if (sender is Button btn)
    {
        btn.Location = new Point(btn.Location.X + 1, btn.Location.Y + 1); // 模拟按下的效果
    }
}

private void button_MouseUp(object sender, MouseEventArgs e)
{
    if (sender is Button btn)
    {
        btn.Location = new Point(btn.Location.X - 1, btn.Location.Y - 1); // 恢复位置
    }
}

:focus (聚焦): 使用 Enter 和 Leave 事件。当控件通过 Tab 键或鼠标点击获得输入焦点时触发。

private void textBox_Enter(object sender, EventArgs e)
{
    if (sender is TextBox tb)
    {
        tb.BackColor = Color.LightYellow; // 获得焦点时背景变黄
    }
}

private void textBox_Leave(object sender, EventArgs e)
{
    if (sender is TextBox tb)
    {
        tb.BackColor = SystemColors.Window; // 失去焦点时恢复
    }
}

:disabled (禁用): 通过控件的 Enabled 属性控制。当 Enabled 为 false 时，WinForms 会自动为其应用一套禁用的外观（通常是灰色）。你也可以在 EnabledChanged 事件中自定义其外观。

样式继承

在 WinForms 中，一些被称为“环境属性”（Ambient Properties）的样式（如 Font, BackColor, ForeColor）可以从父容器继承。

例如，如果你没有为 Button 明确设置 Font，它会自动使用其父容器（如 Form 或 Panel）的 Font 属性。如果父容器也没有设置，它会继续向上寻找，直到找到一个设置了该属性的祖先，或者使用默认值。

这非常有用，你只需设置顶层容器（如窗体 Form）的 Font 和 BackColor，就可以为整个窗体上的大部分控件提供一个统一的基础样式。

注意：一旦你为子控件明确设置了某个环境属性（例如，在属性窗口中修改了按钮的字体），这个显式设置的值将覆盖从父容器继承的值。

菜单、工具栏和状态栏

在经典的桌面应用中，菜单栏、工具栏和状态栏是构成窗体框架的核心元素。WinForms 提供了一套功能强大且统一的“条带”控件来实现它们，主要包括 MenuStrip, ToolStrip, StatusStrip, 和 ContextMenuStrip。

MenuStrip (主菜单栏)

MenuStrip 用于创建应用程序的顶级主菜单，如“文件”、“编辑”、“视图”等。它是用户发现应用程序所有功能的主要入口。

核心组件: MenuStrip 本身是容器，其内容由 ToolStripMenuItem (菜单项) 和 ToolStripSeparator (分隔线) 构成。

设计时操作:

从工具箱拖动一个 MenuStrip 到窗体上，它会自动停靠在顶部。
在设计器中出现的 "在此处键入" 的地方输入菜单项文本。使用 & 符号可以创建访问键（快捷键），例如 文件(&F)，用户按 Alt+F 即可打开该菜单。
可以继续添加子菜单项，形成层级菜单。

常用 ToolStripMenuItem 属性:

Text: 显示的文本，如 新建(&N)。
ShortcutKeys: 为菜单项设置组合快捷键，如 Ctrl+N。这会自动显示在菜单项的右侧。
Image: 为菜单项设置一个图标。
Checked: true 或 false。用于表示一个选项是否被激活，如 “视图” -> “工具栏” 前的对勾。
CheckOnClick: 设置为 true 后，单击菜单项会自动切换 Checked 属性的状态。
Enabled: 控制菜单项是否可用。

代码示例:

// “文件” -> “退出” 菜单项的点击事件
private void exitToolStripMenuItem_Click(object sender, EventArgs e)
{
    // 关闭应用程序
    Application.Exit();
}

// “视图” -> “工具栏” 菜单项的点击事件
private void toolbarToolStripMenuItem_Click(object sender, EventArgs e)
{
    // sender 就是被点击的菜单项
    ToolStripMenuItem menuItem = sender as ToolStripMenuItem;

    // 切换工具栏的可见性
    mainToolStrip.Visible = menuItem.Checked;
}

ToolStrip (工具栏)

ToolStrip 用于创建包含常用功能快捷按钮的工具栏，提供对常用操作的快速访问。

设计时操作:

从工具箱拖动一个 ToolStrip 到窗体上。
使用控件右上角的小箭头或在设计器上直接点击，可以添加不同类型的项。

常用 ToolStrip 项:

ToolStripButton: 标准按钮，最常用。
ToolStripLabel: 静态文本标签。
ToolStripSeparator: 垂直分隔线。
ToolStripDropDownButton: 一个按钮，点击后会显示一个下拉菜单（需要手动关联或动态创建菜单项）。
ToolStripSplitButton: 一个复合按钮，左边是默认点击操作，右边是一个小箭头，点击后会显示下拉菜单。
ToolStripComboBox: 下拉组合框。
ToolStripTextBox: 文本输入框。
ToolStripProgressBar: 进度条。

常用属性:

DisplayStyle: 控制项的显示方式，可以是 Image, Text, ImageAndText, 或 None。
Image: 设置项的图标。
ToolTipText: 鼠标悬停时显示的提示文本。

ToolStrip 和 MenuStrip 可以通过 ToolStripManager 进行合并，这是实现MDI（多文档界面）等复杂应用的关键功能。

StatusStrip (状态栏)

StatusStrip 通常停靠在窗体底部，用于显示应用程序的当前状态、提示信息或任务进度。

常用 StatusStrip 项:

ToolStripStatusLabel: 用于显示文本信息。其 Spring 属性非常有用，设置为 true 后，该标签会自动伸展以填充状态栏中的所有可用空间，常用于将后续项推到最右边。
ToolStripProgressBar: 用于显示长时间任务的进度。

在代码中更新状态:

// 在代码中更新状态栏文本
statusLabel.Text = "Ready";

// 更新进度条
progressBar.Minimum = 0;
progressBar.Maximum = 100;
progressBar.Value = 50;

ContextMenuStrip (上下文菜单)

ContextMenuStrip 用于创建右键菜单。它在设计时不可见，而是存在于窗体下方的组件栏中。

设计时操作:

从工具箱拖动一个 ContextMenuStrip 到窗体上。
在组件栏中选中它，然后在窗体上就会出现一个菜单编辑器，可以像编辑 MenuStrip 一样添加菜单项。
选中需要关联此右键菜单的控件（如一个 TextBox 或 ListView），然后在属性窗口中找到 ContextMenuStrip 属性，从下拉列表中选择刚刚创建的 ContextMenuStrip 即可。

动态显示:

有时右键菜单的内容需要根据点击的位置动态改变。可以在控件的 MouseDown 事件中判断是否为右键点击，然后动态构建或显示菜单。

private void myListView_MouseUp(object sender, MouseEventArgs e)
{
    if (e.Button == MouseButtons.Right)
    {
        // 检查鼠标是否在某个列表项上
        ListViewItem item = myListView.GetItemAt(e.X, e.Y);
        if (item != null)
        {
            // 选中该项
            item.Selected = true;
            // 可以在这里根据 item 的内容修改 contextMenuStrip 的菜单项
            // ...
            // 在鼠标位置显示右键菜单
            itemContextMenuStrip.Show(myListView, e.Location);
        }
    }
}

ToolStripContainer (专业停靠容器)

当你的应用需要多个工具栏，或者希望用户能像 Visual Studio 一样自定义工具栏布局时，就需要使用 ToolStripContainer。

它是一个专业的布局控件，预先在窗体内划分好了五个区域：

顶部停靠区 (TopToolStripPanel)
底部停靠区 (BottomToolStripPanel)
左侧停靠区 (LeftToolStripPanel)
右侧停靠区 (RightToolStripPanel)
中央内容区 (ContentPanel)

核心功能:

多工具栏管理: 可以在同一个停靠区（如顶部）放置多个 ToolStrip，它们会自动排列。
运行时拖动 (Rafting): 用户可以在运行时用鼠标拖动这些工具栏，改变它们的顺序，甚至把一个顶部的工具栏拖到左侧的停靠区。
设计解耦: 清晰地分离了“工具栏区域”和“主内容区域”。你的业务逻辑控件都应放在中央的 ContentPanel 里。

使用流程:

先拖一个 ToolStripContainer 到窗体上，并将其 Dock 属性设置为 Fill。
将 MenuStrip 和 ToolStrip 拖到 ToolStripContainer 的上、下、左、右四个专用停靠区里。
将应用程序的核心内容控件（如 Panel, TabControl 等）放置在中央的 ContentPanel 里。

实用技巧

共享事件处理器: 为了避免代码重复，可以将功能相同的菜单项和工具栏按钮关联到同一个事件处理方法。例如，“文件”->“保存”菜单项和工具栏上的“保存”按钮，都可以将其 Click 事件指向 SaveFile_Click 方法。
统一管理图标: 使用 ImageList 控件或项目资源 (Properties.Resources) 来存储所有图标。将 ImageList 分配给 MenuStrip 或 ToolStrip 的 ImageList 属性后，就可以通过 ImageKey 或 ImageIndex 属性为各项方便地设置图标，便于统一管理。
同步状态: 保持菜单项和工具栏按钮状态的同步非常重要。例如，如果用户通过菜单禁用了某个功能，工具栏上对应的按钮也应该变为禁用状态。

private void UpdateSaveState(bool canSave)
{
    // 同步更新菜单项和工具栏按钮的 Enabled 状态
    saveAsToolStripMenuItem.Enabled = canSave;
    saveToolstripButton.Enabled = canSave;
}

一个练习

请用前面学到的知识，完成下面的 HTTP API 接口测试工具的界面设计。

界面设计

您需要高效学习，找工作？ 点击咨询 报名实战班

点击查看学员就业情况

界面布局 (Layout)

Anchor 属性

Dock 属性

容器控件

Panel

TableLayoutPanel

SplitContainer

TabControl

FlowLayoutPanel

控件样式

核心样式属性

Margin 与 Padding

在代码中设置样式

模拟 CSS 选择器和伪状态

模拟选择器

模拟伪状态

样式继承

菜单、工具栏和状态栏

MenuStrip (主菜单栏)

ToolStrip (工具栏)

StatusStrip (状态栏)

ContextMenuStrip (上下文菜单)

ToolStripContainer (专业停靠容器)

实用技巧

一个练习

您需要高效学习，找工作？ 点击咨询 报名实战班

点击查看学员就业情况

您需要高效学习，找工作？点击咨询报名实战班

您需要高效学习，找工作？点击咨询报名实战班