Как добавить команду в строку заголовка или палитру команд VS Code Explorer, которая активна только в том случае, если мое веб-представление сфокусировано?

Question

Я пишу расширение, которое использует webview api VS Code.Мое расширение также регистрирует команду refresh preview, которая обновляет содержимое веб-просмотра.Как я могу сделать так, чтобы:

• Команда refresh preview отображается только в палитре команд, когда мое веб-представление сфокусировано?

• Команда refresh preview отображается в строке заголовка редактора веб-просмотра?

Answer 1

Сначала создайте пользовательский контекстный ключ , который отслеживает фокусировку вашего веб-обзора.Используйте команду setContext VS Code, чтобы отслеживать этот контекстный ключ, когда ваш веб-просмотр сфокусирован:

const myWebview = ...;

// Make the context key track when one of your webviews is focused
myWebview.onDidChangeViewState(({ webviewPanel }) => {
    vscode.commands.executeCommand('setContext',
        'myWebviewFocused',
        webviewPanel.active);
});

Затем используйте ваш контекстный ключ в предложениях when точки расширения вашего * меню

Для команды с идентификатором myExtension.refreshPreview, чтобы команда отображалась только в палитре команд, когда ваше веб-изображение сфокусировано, используйте следующий вклад:

{
  "contributes": {
    "menus": {
      "commandPalette": [
        {
          "command": "myExtension.refreshPreview",
          "when": "myWebviewFocused",
        }
      ]
    }
  }
}

Для добавлениякоманду (возможно со значком) в строке заголовка редактора вашего веб-просмотра, используйте editor/title точку вклада:

{
  "contributes": {
    "menus": {
      "editor/title": [
        {
          "command": "myExtension.refreshPreview",
          "when": "myWebviewFocused",
        }
      ]
    }
  }
}

Извлеките VS Расширение встроенной уценки кода дляболее продвинутый пример этого.