VSCode扩展:如何在面板中以编程方式显示视图容器

Question

我正在编写一个VSCode扩展，它有一个添加了WebviewView的视图容器。

"contributes": {
"commands": [
{
"command": "showView",
"title": "Show view"
}
],
"viewsContainers": {
"panel": [
{
"id": "mycontainer",
"title": "My Container",
"icon": "media/app.svg"
}
]
},
"views": {
"mycontainer": [
{
"type": "webview",
"id": "myview",
"name": "MyView"
}
]
}
},

在showView命令实现中。我想通过编程使视图myview显示在VSCode UI中。如何做到这一点？

Answer 1

您可以通过使用视图的id并执行focus命令来关注侧边栏中的视图：

vscode.commands.executeCommand("myview.focus")

Answer 2

VSCode在注册的每个视图上公开一个focus命令。

示例视图的ID为myview，因此要调用myview.focus命令。

您可以通过打开File->Prefs->Keyboard Shortcuts并搜索myview来验证这一点。

要测试该命令，请尝试在扩展激活功能中添加以下内容。它将在底部状态栏上创建一个可点击的按钮，集中您的侧边栏视图。

activate = function (workspace) {
const statusBarItem = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, 10);
statusBarItem.command = 'myview.focus';
statusBarItem.text = 'MYVIEW';
statusBarItem.show();
workspace.subscriptions.push(statusBarItem);
}