浏览量
视图 是内容容器,可以在侧边栏或面板中显示。视图可以包含树视图、欢迎视图或WebView视图,并且还可以显示视图操作。用户还可以重新排列视图或将视图移动到另一个视图容器(例如,从主侧边栏移动到次侧边栏)。请限制创建的视图数量,因为其他扩展可能在相同的视图容器中进行贡献。
✔️ 做
- 尽可能使用现有图标
- 使用文件图标来表示语言文件
- 使用树形视图显示数据
- 为每个视图添加一个图标(如果将其移动到活动栏或次级侧边栏——两者都使用图标来表示视图)
- 将浏览次数保持在最低限度
- 将名称长度保持在最短。
- 限制自定义WebView视图的使用
❌ 不要
- 重复现有功能
- 将树形项目用作单个操作项目(例如,点击时执行命令)
- 如果不需要,请使用自定义WebView视图
- 使用活动栏项(视图容器)在编辑器中打开一个网页视图

这个例子使用树视图来显示一个扁平的树视图项列表。
查看位置
视图可以放置在现有的视图容器中,例如文件资源管理器、源代码管理(SCM)和调试视图容器。它们也可以通过活动栏添加到自定义视图容器中。此外,视图可以添加到面板中的任何视图容器中。它们也可以拖动到次级侧边栏。

查看容器
视图容器,顾名思义,是视图渲染的“父”容器。扩展可以向活动栏/主侧边栏或面板贡献自定义视图容器。用户可以从活动栏将整个视图容器拖动到面板(反之亦然),还可以移动单个视图。

这是一个视图容器放置在活动栏/主侧边栏中的示例

这是一个放置在面板中的视图容器示例
树视图
树视图是一种强大的灵活格式,用于在视图中显示内容。扩展可以添加从简单扁平列表到深度嵌套树的一切内容。
- 使用描述性标签为项目提供上下文(如适用)
- 使用产品图标来区分项目类型(如果适用)
❌ 不要
- 将树视图项用作按钮以执行命令
- 除非必要,避免深度嵌套。大多数情况下,几层的文件夹/项目是一个不错的平衡。
- 为一个物品添加超过三个动作

欢迎浏览
当视图为空时,您可以添加内容来指导用户如何使用您的扩展或开始使用。欢迎视图中支持链接和图标。
✔️ 做
- 仅在必要时使用欢迎视图
- 尽可能使用链接而不是按钮
- 按钮仅用于主要操作
- 使用清晰的链接文本来表明链接目的地
- 限制内容长度
- 限制欢迎视图的数量
- 限制视图中的按钮数量
❌ 不要
- 如果不需要,请使用按钮
- 使用欢迎视图进行促销
- 使用通用的“阅读更多”作为链接文本

这个例子展示了扩展的一个主要操作,并提供了一个额外的文档链接。
观点与进展
您还可以通过引用视图的ID在视图中显示进度。

查看操作
视图可以暴露视图操作在视图工具栏上。小心不要添加太多的操作,以避免噪音和混淆。使用内置的产品图标有助于扩展与原生用户界面的融合。然而,如果需要自定义图标,也可以提供SVG图标。
