可访问性

Visual Studio Code 提供了许多功能,以帮助所有用户都能使用编辑器。缩放级别和高对比度颜色提高了编辑器的可见性,仅使用键盘的导航支持无需鼠标的操作,并且编辑器针对屏幕阅读器进行了优化。

缩放

你可以在VS Code中通过视图 > 外观 > 缩放命令来调整缩放级别。每个缩放命令会将缩放级别增加或减少20%。

  • 视图 > 外观 > 放大 (⌘= (Windows, Linux Ctrl+=)) - 增加缩放级别。
  • 视图 > 外观 > 缩小 (⌘- (Windows, Linux Ctrl+-)) - 缩小缩放级别。
  • 视图 > 外观 > 重置缩放 (⌘Numpad0 (Windows, Linux Ctrl+Numpad0)) - 将缩放级别重置为0。

注意: 如果您正在使用放大镜,请在查看悬停时按住 Alt 键,以将光标移动到悬停上方。

放大编辑器

持久化的缩放级别

当你使用视图 > 外观 > 放大 / 缩小命令调整缩放级别时,缩放级别会保存在window.zoomLevel 设置中。默认值为0,每次增加/减少都会使缩放级别改变20%。

辅助功能帮助

命令 Open Accessibility Help ⌥F1 (Windows Alt+F1, Linux Shift+Alt+F1) 根据当前上下文打开帮助菜单。它目前适用于编辑器、终端、笔记本、聊天视图和内联聊天功能。

您可以从帮助菜单中关闭辅助功能帮助菜单或打开其他文档。

在编辑器中触发时,会出现一个对话框,解释如何显式启用屏幕阅读器模式、标签焦点模式和其他详细信息

高对比度主题

VS Code 在所有平台上都支持高对比度颜色主题。使用 文件 > 首选项 > 主题 > 颜色主题 (⌘K ⌘T (Windows, Linux Ctrl+K Ctrl+T)) 来显示 选择颜色主题 下拉菜单并选择 高对比度 主题。

高对比度主题

色觉无障碍

您可以在Visual Studio Marketplace中搜索与色觉缺陷兼容的扩展。使用扩展视图⇧⌘X (Windows, Linux Ctrl+Shift+X)并搜索“color blind”以获取相关选项。

Visual Studio Marketplace 在 VS Code 用户界面中的显示

一旦你从市场安装了颜色主题,你可以通过文件 > 首选项 > 主题 > 颜色主题 ⌘K ⌘T (Windows, Linux Ctrl+K Ctrl+T)来更改颜色主题

选择颜色主题的下拉菜单

  • GitHub - 适用于大多数色盲形式,并与GitHub设置中的主题相匹配。
  • Gotthard - 针对大约20种编程语言进行了优化。
  • Blinds - 专为绿色盲人士设计,具有高对比度的色彩比例。
  • Greative - 同时考虑色盲和光敏感。
  • Pitaya Smoothie - 适用于大多数色盲形式,并符合WCAG 2.1颜色对比标准

自定义警告颜色

VS Code 的默认颜色主题是 Dark+。但是,您可以自定义用户界面中的主题和属性颜色。

注意: 前往 自定义颜色主题 了解更多关于覆盖当前主题颜色的信息。

要自定义错误和警告的波浪线,请转到文件 > 首选项 > 设置以进行用户设置。搜索“颜色自定义”以找到工作台:颜色自定义设置,并通过选择在settings.json中编辑来打开您的用户settings.json文件。

JSON文件设置图标

在你的settings.json文件中,将以下代码嵌套在最外层的大括号内。你可以通过输入十六进制代码为每个对象分配颜色。

"workbench.colorCustomizations": {
    "editorError.foreground": "#ffef0f",
    "editorWarning.foreground": "#3777ff"
}

在以下示例中,当JSON项后缺少逗号时,会应用警告颜色。

用于更改错误/警告波浪线颜色的JSON代码

  • editorError.foreground - 覆盖错误下方的波浪线。
  • editorWarning.foreground - 覆盖警告下方的波浪线。
  • editorError.background - 覆盖错误的高亮颜色。
  • editorWarning.background - 覆盖警告的高亮颜色。

editorErroreditorWarning的背景分配颜色也有助于识别潜在问题。您选择的颜色将突出显示相应的错误或警告。前面示例中显示的颜色,#ffef0f(黄色)和#37777ff(蓝色),对于具有常见色觉缺陷的个体来说更易于识别。

选择可访问的颜色

颜色的可访问性对于异常三色视觉(色盲)的类型是主观的。严重程度因人而异,可以分为四种情况类型:

Condition Type
Deuteranopia Reduced sensitivity to green light. It is the most common form of color blindness.
Protanopia Reduced sensitivity to red light.
Tritanopia Reduced sensitivity to blue light. This condition is considered rare.
Monochromia The inability to see all colors, also referred to as achromatopsia. More information about the rarest form of color blindness: Foundation for Fighting Blindness.

选择特定条件下最佳颜色的最佳方法之一是应用互补色。这些颜色位于色轮上彼此相对的位置。

色轮突出显示了常规视觉、绿色盲、红色盲、蓝色盲和全色盲的互补色

注意: 有关查找互补色的更多信息,请访问Adobe Color上的色盲模拟器和交互式色轮。

淡化未聚焦的编辑器和终端

未聚焦的视图可以变暗,以更清楚地显示输入将去往何处。这在处理多个编辑器组或终端时特别有用。通过设置"accessibility.dimUnfocused.enabled": true来开启此功能。您可以使用accessibility.dimUnfocused.opacity来控制暗度级别,该值接受从0.2到1的不透明度分数(默认值为0.75)。

键盘导航

VS Code 在命令面板 (⇧⌘P (Windows, Linux Ctrl+Shift+P)) 中提供了详尽的命令列表,以便您可以在不使用鼠标的情况下使用 VS Code。按下 ⇧⌘P (Windows, Linux Ctrl+Shift+P),然后输入命令名称(例如 'git')以过滤命令列表。

VS Code 也有许多预设的键盘快捷键用于命令。

命令的快捷键显示在命令面板条目的末尾

您还可以设置自己的键盘快捷键。文件 > 首选项 > 键盘快捷键 (⌘K ⌘S (Windows, Linux Ctrl+K Ctrl+S)) 打开键盘快捷键编辑器,在这里您可以发现并修改VS Code操作的键绑定。有关自定义或添加自己的键盘快捷键的更多详细信息,请参见键绑定

为了在工作台中快速导航,我们建议使用聚焦下一部分 (F6) 和 聚焦上一部分 (⇧F6 (Windows, Linux Shift+F6)) 命令。

锚点选择

为了更轻松地使用键盘开始和结束选择,有四个命令:设置选择锚点 (⌘K ⌘B (Windows, Linux Ctrl+K Ctrl+B)), 从锚点到光标选择 (⌘K ⌘K (Windows, Linux Ctrl+K Ctrl+K)), 取消选择锚点 (Escape) 和 转到选择锚点

标签导航

你可以使用Tab键在VS Code中的UI控件之间导航。使用Shift+Tab可以反向切换。当你通过UI控件切换时,每个UI元素在获得焦点时周围会出现一个指示器。

工作台中的所有元素都支持标签导航。为了避免有太多的标签停留点,工作台工具栏和标签列表各自只有一个。一旦工具栏或标签列表获得焦点,您可以使用箭头键在它们内部导航。

注意: 标签导航按照视觉上的自然顺序进行,除了WebViews(如Markdown预览)。对于WebViews,我们建议使用F6⇧F6 (Windows, Linux Shift+F6)命令在WebViews和工作台的其他部分之间导航。或者,您可以使用众多焦点编辑器命令中的一个。

Tab 捕获

默认情况下,在源代码文件中按下 Tab 会插入 Tab 字符(或根据您的缩进设置插入空格),并且不会离开当前打开的文件。您可以通过 ⌃⇧M (Windows, Linux Ctrl+M) 来切换 Tab 捕获功能,随后的 Tab 键将把焦点移出文件。当默认的 Tab 捕获功能关闭时,您会在状态栏中看到一个 Tab 移动焦点 的指示器。

Tab键捕获功能也存在于集成终端中。该功能的默认行为可以通过editor.tabFocusMode进行配置。

当模式激活时,显示一个Tab移动焦点状态栏项

你也可以通过命令面板⇧⌘P (Windows, Linux Ctrl+Shift+P))中的切换Tab键移动焦点操作来开启或关闭Tab键的捕获功能。

只读文件从不捕获 Tab 键。集成终端 面板尊重 Tab 捕获模式,并且可以通过 ⌃⇧M (Windows, Linux Ctrl+M) 进行切换。

屏幕阅读器

VS Code 在编辑器中支持屏幕阅读器,采用基于文本分页的策略。以下屏幕阅读器已经过测试:

对于NVDA,我们建议您保持在焦点模式并使用快捷键进行导航,而不是使用浏览模式。

转到下一个/上一个错误或警告操作(F8⇧F8 (Windows, Linux Shift+F8))允许屏幕阅读器宣布错误和警告消息。

当建议弹出时,它们会被宣布给屏幕阅读器。使用 Ctrl+UpCtrl+Down 导航建议,并使用 Shift+Escape 关闭它们。如果建议妨碍了您,您可以通过 editor.quickSuggestions 设置将其关闭。

在差异视图窗格中,转到下一个/上一个差异操作(F7⇧F7 (Windows, Linux Shift+F7))将显示可访问的差异查看器,差异以统一的补丁格式呈现。使用键导航未更改、插入或删除的行。按Enter键将焦点返回到差异编辑器的修改窗格,位于选定的行号(或如果选择了删除的行,则返回到仍然存在的最接近的行号)。使用EscapeShift+Escape键关闭可访问的差异查看器。

屏幕阅读器模式

当VS Code检测到正在使用屏幕阅读器时,它会进入针对编辑器和集成终端等UI的优化屏幕阅读器模式。状态栏将在右下角显示屏幕阅读器优化。您可以通过点击显示文本或使用切换屏幕阅读器辅助功能模式命令退出屏幕阅读器模式。

激活屏幕阅读器优化的状态栏将显示一个允许禁用该模式的通知

某些功能,例如折叠和小地图(代码概览),在屏幕阅读器模式下会被禁用。您可以通过编辑器:辅助功能支持设置(editor.accessibilitySupport)来控制VS Code是否使用屏幕阅读器模式,其值为onoff或默认的auto,后者通过查询平台自动检测屏幕阅读器。

通过键盘调整表格列宽

list.resizeColumn 命令使您能够使用键盘调整列的大小。您可以分配一个键盘快捷键来触发此命令。

当你触发此命令时,选择你想要调整大小的列,并提供你想要设置的宽度百分比。以下视频展示了如何将此应用于键盘快捷键编辑器中的列调整大小。

可访问视图

运行命令 Open Accessible View ⌥F2 (Windows Alt+F2, Linux Shift+Alt+F2) 以显示可访问视图并逐字符、逐行检查内容。可访问视图目前可用于悬停、通知、注释、笔记本输出、终端输出、聊天响应、内联补全、调试控制台输出等。

输入控制和结果导航

在扩展视图、键盘快捷键编辑器以及评论、问题和调试控制台面板之间导航输入控件(例如搜索或筛选输入)及其结果是一致的,使用(⌘↓ (Windows, Linux Ctrl+Down))和(⌘↑ (Windows, Linux Ctrl+Up))。

终端可访问性

您可以通过⌥F1 (Windows Alt+F1, Linux Shift+Alt+F1)显示终端辅助功能帮助,其中描述了使用屏幕阅读器时的有用提示。一个提示是使用⌥F2 (Windows Alt+F2, Linux Shift+Alt+F2)来访问终端中的缓冲区。这将根据您的屏幕阅读器自动进入浏览模式,以便可访问地查看整个终端缓冲区。

使用 editor.tabFocusMode 来控制终端是否接收 Tab 键,而不是工作台,类似于编辑器。

Shell 集成

终端有一个名为shell集成的功能,该功能启用了许多其他终端不具备的附加功能。在使用屏幕阅读器时,运行最近命令转到最近目录功能特别有用。

另一个由shell集成驱动的命令,在可访问视图中转到符号 (⇧⌘O (Windows, Linux Ctrl+Shift+O)),允许您在终端命令之间导航,类似于编辑器中的转到编辑器中的符号...导航。

最小对比度

terminal.integrated.minimumContrastRatio 设置为1到21之间的数字,以调整文本颜色的亮度,直到达到所需的对比度或达到纯白色(#FFFFFF)或纯黑色(#000000)。

请注意,terminal.integrated.minimumContrastRatio 设置将不适用于 powerline 字符。

状态栏可访问性

一旦通过聚焦下一部分 (F6)将焦点置于状态栏中,您可以使用箭头导航在状态栏条目之间移动焦点。

差异编辑器可访问性

在差异编辑器中有一个可访问的差异查看器,它以统一的补丁格式呈现更改。您可以使用转到下一个差异 (F7) 和 转到上一个差异 (⇧F7 (Windows, Linux Shift+F7)) 在更改之间导航。使用箭头键导航行,并按 Enter 键跳回差异编辑器并选择行。

调试器可访问性

VS Code 调试器界面是用户可访问的,并具有以下功能:

  • 调试状态变化被读取(例如,'已启动','断点命中','已终止',...)。
  • 所有调试操作均可通过键盘访问。
  • 运行和调试视图以及调试控制台都支持Tab键导航。
  • 调试悬停功能可通过键盘访问 (⌘K ⌘I (Windows, Linux Ctrl+K Ctrl+I)).
  • 可以创建键盘快捷键以将焦点设置到每个调试器区域。
  • 在调试过程中,当焦点位于编辑器中时,调用Debug: Add to Watch命令会显示变量的值。

可访问性信号

可访问性信号指示当前行是否具有某些标记,例如:错误、警告、断点、折叠文本区域或内联建议。

当主光标改变其行或首次在当前行添加标记时,它们会被播放。当连接屏幕阅读器时,可访问性信号声音和公告可能会自动启用,并可以通过设置accessibility.signals.*进行控制。

命令 Help: List Signal Sounds 列出了所有可用的声音,让你在浏览列表时听到每个声音,并允许配置它们的启用/禁用状态。

Aria 公告还会通知屏幕阅读器和盲文用户某些标记已被触发。命令 Help: List Signal Announcements 会告知用户哪些公告可用,并允许配置其启用/禁用状态。

悬停可访问性

某些悬停内容无法正常悬停,这使得它们在使用屏幕放大镜时难以使用。为了解决这个问题,当悬停内容激活时,按住AltOption键以“锁定”它,使其在悬停时不会隐藏。释放按键以解锁悬停内容。

当前已知问题

VS Code 有一些已知的可访问性问题,具体取决于平台。要查看完整列表,请访问 VS Code 可访问性问题

macOS

编辑器包括对VoiceOver的屏幕阅读器支持。

Linux

VS Code 与 Orca 屏幕阅读器兼容良好。如果您在 Linux 发行版中的 Orca 无法读取编辑器内容:

  • 确保在VS Code中设置了"editor.accessibilitySupport": "on"。您可以通过设置或运行显示辅助功能帮助命令并按Ctrl+E来开启accessibilitySupport。
  • 如果Orca仍然没有声音,尝试将ACCESSIBILITY_ENABLED=1设置为环境变量。

启用该设置后,VS Code 应该可以与 Orca 屏幕阅读器一起工作。

下一步

继续阅读以了解以下内容: