应用栏指南和清单(Windows 应用商店应用)

请在处理 Windows 应用商店应用的应用栏时遵循这些指南。

路线图: 本主题与其他主题有何关联?请参阅:

用户体验指南

通过应用栏,用户可以在需要时轻松访问相应的命令。用户可以轻扫屏幕的底部边缘以显示应用栏,然后可以与其中的内容交互以使应用栏消失。应用栏还可用于显示特定于用户上下文的命令或选项,例如照片选择或绘图模式。

如果你有用户完成工作流所必需的命令(如购买产品),请将这些命令放在画布上(而不是应用栏上)。

应用栏命令的指南

按照这些指南可以将你的命令放在应用栏上。

  • 请务必将互异的命令组分别置于应用栏的两侧加以分隔。

    如果你有两个互异的命令集(例如,一个用于创建新内容,另一个用于筛选视图), 则可将一个命令集置于应用栏右侧,而将另一个命令集置于左侧。

    如果有多个命令集,则可使用分隔符将其分隔开 。

  • 请务必将整个应用中的命令终始放置在统一位置。

    每个页面仅应包含与该页面相关的命令,如有任何命令在页面之间共享,则应尽可能将这些命令放置在同一位置附近,以便用户可预估命令所处的位置。

  • 请务必遵循位置约定。

    • 将“新建”/“添加”/“创建”按钮(+ 图标)放置在最右边。
    • 将视图切换按钮分为一组,并将它们放置在最左边。
    • 将“接受”、“是”、“确定”命令放置在“拒绝”、“否”、“取消”命令左侧。
  • 请务必在选择某项时使命令根据上下文显示在应用栏上,并自动显示应用栏。

    大多数用户都惯用右手,因此当用户在应用页面中选择某项时,与该项相关的所有命令都应显示在应用栏的左侧。这样,他们的手臂或手就不会妨碍他们查看命令。

  • 在显示上下文命令时,一定将应用栏的解除模式设置为粘滞。

    如果在应用栏上有上下文命令,则在该上下文存在时将模式设置为粘滞,这样,当用户与应用交互时,应用栏就不会自动隐藏。当上下文不再存在时,关闭粘滞模式。

    例如,你可能想要在用户选择图像时显示照片操作的上下文命令,同时你又希望让用户能够继续处理图像,例如旋转或裁剪图像。在这种情况下,应用栏将保持可见状态,直至用户取消选择图像或使用边缘轻扫解除应用栏。

  • 请务必在命令过多时使用菜单和弹出窗口。

    如果你无法以单独按钮的形式将所有命令放在一个应用栏中,则需要将相似的命令分组到一起,并将它们放在可从应用栏按钮打开的菜单中。

    应用栏菜单

    对这些命令使用逻辑分组,例如将“答复”、“全部答复”和“转发”放在“响应”菜单中。

    不要为无关的杂项命令创建诸如“更多”或“高级”这样的菜单。这些类型的常规命令往往会让应用感觉更复杂,只有一小部分用户会探索这些菜单。如果你发现自己需要一个溢出,但是没有任何逻辑分组可用,请考虑简化你的应用。

  • 一定将应用栏设计为对齐和纵向视图。

    确保你的应用栏命令正确显示在辅屏和纵向视图中。

    有关详细信息,请参阅如何以不同视图使用应用栏

  • 一定设计为水平滚动。

    如果你的应用在应用页面底部有一个水平滚动区域,则在应用栏处于粘滞模式时,减少滚动区域的高度。否则,应用栏可能会盖住滚动条,而用户可能需要设法解除应用栏以保持滚动。因此,应尽量使滚动条底部边缘紧靠应用栏的顶部边缘。

  • 一定要使用命令、菜单和弹出窗口的默认样式。

    用户已习惯按钮位置和尺寸,因此,如果你希望自定义应用栏,我们建议自定义背景、图标和标签的颜色,但不要自定义按钮的尺寸和填充。默认布局设计用于支持触摸操作,在所有受支持宽度的屏幕上可放置十个命令。对布局做出更改可能会导致意想不到的行为。

    有关详细信息,请参阅快速入门:设置应用栏按钮的样式

  • 请使用底部的应用栏执行命令,使用导航栏进行导航。

    通常,对于作用于当前页面的命令,使用底部应用栏。对于将用户移动到另一页的导航元素,使用导航栏。

  • 请务必对命令使用内置图标。

    有关详细信息,请参阅快速入门:设置应用栏按钮的样式

  • 不要将关键命令放在应用栏上。

    请勿将凸显应用重要性的核心命令放在应用栏上。例如,在相机应用中,应将“照相”命令放在应用页面中,而不要放在应用栏上。你可以在应用页面中添加一个照相按钮,或者让用户只需点击预览即可照相。

  • 不要在应用栏中放置登录、注销或其他帐户管理命令。

    所有的帐户管理命令(如登录、注销、帐户设置或创建帐户)都应当放在“设置”弹出窗口中。如果用户必须登录特定页面,则在应用页面中提供登录按钮。

  • 不要将用于文本的剪贴板命令放在应用栏上。

    将“剪切”、“复制”和“粘贴”命令放在应用页面上的上下文菜单中,而不要放在应用栏上。

  • 请勿将应用设置放在应用栏上。

    所有应用设置命令(如默认值和首选项)应放在“设置”弹出窗口中。“设置”弹出窗口也是放置不常使用的管理命令(如用于清除历史记录的命令)的最佳位置。

处理鼠标右键

若要保持你的应用 UI 与其他 Windows 应用商店应用一致,则用户需单击鼠标右键以触发你提供的应用栏。如果有必须使用鼠标右键进行其他操作的应用,如游戏中的辅助开火或 3-D 查看器的虚拟轨迹球,则应用可忽略引发应用栏的事件。但是你仍必须考虑应用栏或类似上下文菜单在你的游戏控制模型中的角色,因为这是 Windows 应用商店应用体验的重要部分。

设计应用控件时应遵循这些指南:

  • 如果你的应用必须使用鼠标右键操作重要功能,则直接使用操作该功能。如果对工作流不重要,不要激活任何上下文 UI 或应用栏。
  • 如果存在不需要应用特定的右键单击操作的 Microsoft DirectX 表面区域,如边框菜单,则当用户右键单击这些区域时会显示该应用栏。
  • 如果画布上需要鼠标右键支持,当用户右键单击最顶部水平像素行、最底部水平像素行,或者两个时,则显示该应用栏。
  • 如果没有解决方案可以满足,则将自定义控件放到 DirectX 表面上,以便鼠标手势可以打开应用栏。
  • 使用 MouseDevice 类事件,如 MouseMoved,以执行你自己的上下文菜单行为。
  • 使用触摸操作时,长按或者按住与单击鼠标右键的作用相同。以类似的方式处理两个事件。要处理该事件并定义其自定义行为,则注册 Holding 事件。要启用按住,则设置 GestureSettings 属性支持触摸按住,以及笔和触笔输入。要用鼠标启用按住行为,则在 GestureSettings 属性中设置 HoldWithMouse
  • 不要在你的应用中提供 Win+Z 键击组合的替代行为。开发应用栏或类似上下文菜单,并在用户按压 Windows 键和 Z 键时显示它。注册 KeyDownAcceleratorKeyActivated 事件以确定何时按两个键。

相关主题

快速入门:添加应用栏

快速入门:设置应用栏按钮的样式

如何以不同视图使用应用栏

AppBar