菜单和上下文菜单

  • 项目

菜单和上下文菜单在外观和可以包含的内容方面类似。 它们都显示命令或选项的组织列表，并通过隐藏命令或选项来节省空间，直到用户需要它们。 不过，它们之间有一些差异，如应该使用什么来创建它们，以及用户如何访问它们。

典型上下文菜单示例

这是正确的控件吗？

菜单和上下文菜单用于组织命令并通过隐藏这些命令来节省空间，直到用户需要它们。 若要显示任意内容（如通知或请求确认），则使用对话框或浮出控件。

如果需要经常使用某一特定命令并希望有可用的空间，请考虑将该命令直接置于其自己的元素中，以便用户无需遍历菜单即可访问它。

何时应使用菜单或上下文菜单？

  • 如果主机元素是一个按钮或其他一些命令元素（其主要作用是显示其他命令），则使用菜单。
  • 如果主机元素是一些具有另一主要用途（如显示文本或图像）的其他类型的元素，则使用上下文菜单。

如果要将命令（如剪切、复制和粘贴）添加到某个文本或图像元素，请使用上下文菜单而不是菜单。 在此方案中，文本元素的主要作用是显示和编辑文本；其他命令（如剪切、复制和粘贴）是辅助命令，属于上下文菜单。

照片库中的上下文菜单示例

上下文菜单

上下文菜单具有以下特征：

  • 附加到单个元素并显示辅助命令。
  • 通过右键单击（或等效操作，例如用手指按住）进行调用。
  • 通过 ContextFlyout 属性与元素相关联。

如果上下文菜单包含常见命令（如复制、剪切、粘贴、删除、共享或文本选择命令），请使用命令栏浮出控件，并将这些常见命令作为主要命令组合在一起，以使它们在上下文菜单中显示为单个水平行。

如果上下文菜单不包含常用命令，则可以使用命令栏浮出控件或菜单浮出控件来显示上下文菜单。 建议使用 CommandBarFlyout，因为它提供的功能比 MenuFlyout 多，并且如果需要，只使用辅助命令即可实现相同的行为和外观。

菜单具有以下特性：

  • 具有始终显示的单个入口点（例如，位于屏幕顶部的“文件”菜单）。
  • 通常附加到某个按钮或父菜单项。
  • 通过左键单击（或等效操作，例如用手指点击）进行调用。
  • 通过 Flyout 或 FlyoutBase.AttachedFlyout 属性与元素相关联，或在应用窗口顶部的菜单栏中进行分组。

当用户调用主要角色是显示其他命令的命令元素（例如按钮）时，请使用菜单浮出控件来承载单个顶级菜单，并将其以内联方式显示为附加到画布 UI 元素的浮出控件。 每个 MenuFlyout 都可以托管菜单项和子菜单。 对于可能需要更多组织或分组的应用，可以使用菜单栏来快速快捷地显示水平行中的多个顶层菜单集。

UWP 和 WinUI 2

重要

本文中的信息和示例针对使用 Windows 应用 SDK 和 WinUI 3 的应用进行优化，但通常适用于使用 WinUI 2 的 UWP 应用。 有关特定于平台的信息和示例，请参阅 UWP API 参考。

本部分包含你在 UWP 或 WinUI 2 应用中使用该控件所需的信息。

UWP 应用的 CommandBarFlyout 和 MenuBar 控件作为 Windows UI 库 2 的一部分包含在内。 有关详细信息（包括安装说明），请参阅 Windows UI 库。 这些控件的 API 同时存在于 Windows.UI.Xaml.Controls 和 Microsoft.UI.Xaml.Controls 命名空间中。

建议使用最新的 WinUI 2 来获取所有控件的最新样式和模板。 WinUI 2.2 或更高版本包含这些使用圆角的控件的新模板。 有关详细信息，请参阅圆角半径。

若要将本文中的代码与 WinUI 2 配合使用，请使用 XAML 中的别名 (我们使用 muxc) 来表示项目中包含的 Windows UI 库 API。 有关详细信息 ，请参阅 WinUI 2 入门 。

xmlns:muxc="using:Microsoft.UI.Xaml.Controls"

<muxc:CommandBarFlyout />
<muxc:MenuBar />