Skip to content

Sidebars

The Primary and Secondary Sidebars consists of one or more Views contributed by a View Container. Extensions can contribute Views to an existing View Container (for example, Explorer) or they can contribute an entirely new View Container.

✔️ Do

  • Group related Views and content together
  • Use clear, descriptive names for View Containers and their Views

❌ Don't

  • Use an excessive number of View Containers. A single View Container (such as a Sidebar with Views unique to that extension) is generally enough for most extensions.
  • Use an excessive number of Views (3-5 is a comfortable max for most screen sizes)
  • Add content to the Sidebar that could be a simple Command.
  • Repeat existing functionality

Example of two sidebars

Primary Sidebar

Many extensions choose to contribute Views and/or View Containers to the Primary Sidebar given the high visibility it gives content. Use good judgement when adding content here—too much contributed UI can lead to a cluttered experience that can confuse your users.

Example of the primary sidebar

Secondary Sidebar

As the name implies, the Secondary Sidebar is normally considered a auxiliary location for Views. While extensions cannot contribute Views directly to it by default, users can drag Views from the Primary Sidebar or the Panel to customize their layout.

Example of the secondary sidebar

By default, View Containers in the Sidebar with more than one View will feature a single ... icon button in the Sidebar Toolbar to show and hide each View. That looks something like this:

Sidebar with two views

However, if only one View is used, the Sidebar will automatically consolidate the UI to use the Sidebar Toolbar to render all of the actions specific to that View. In place of the ... button, the two actions associated with the 'Notes' View are rendered in its place:

Sidebar with a single view and toolbar with actions

As with other toolbars, be careful to not add too many actions to reduce clutter and confusion. If possible, use an existing product icon paired with a descriptive Command name.

评论区
评论区空空如也
发送评论
名字
0 / 20
邮箱
0 / 100
评论内容
0 / 140
由于是非实名评论,所以不提供删除功能。如果你需要删除你发送的评论,或者是其他人的评论对你造成了困扰,请 发邮件给我 。同时评论区会使用 AI + 人工的方式进行审核,以达到合规要求。

© thebestxt.cc
辽ICP备16009524号-8
本站所有文章版权所有,转载请注明出处