logo标签列表

如何在VSCode中创建自定义对话框？

visual-studio-codevscode-extensions
15

我正在开发一个VSCode的扩展程序，需要显示一个自定义对话框来帮助用户配置 ini 文件。

是否可以创建一个带标签和输入框的自定义对话框？

1个回答
21

您无法创建新的 UI 元素，但如果您想从用户那里获取输入，可以使用以下代码：

let options: InputBoxOptions = {
    prompt: "Label: ",
    placeHolder: "(placeholder)"
}

window.showInputBox(options).then(value => {
    if (!value) return;
    answer1 = value;
    // show the next dialog, etc.
});

这将使用与命令面板相同的用户界面（当您按下Ctrl+P或任何其他打开顶部输入框的命令时）。

这在2017年仍然有效吗？我还想知道是否有关于VSCode的“UI策略”或其他相关内容的参考资料，他们是否讨论了为什么这还不是API的一部分，或者他们是否计划在未来实现它？ - Dimitry K
1
是的，这仍然是正确的。您可以在此处阅读此决定背后的原则：https://code.visualstudio.com/docs/extensionAPI/patterns-and-principles - Llewey
1
我们不向扩展开发者提供直接访问底层 UI DOM 的途径。在 VS Code 中，我们不断尝试优化基础 Web 技术的使用...随着这些技术和我们的产品不断演进，我们将继续调整对 DOM 的使用方式...我们在独立的宿主进程中运行扩展，并防止直接访问 DOM。VS Code 还包括一组内置的 UI 组件，用于常见场景，例如 IntelliSense，使得这些体验在各种编程语言和扩展之间保持一致，扩展开发者无需构建自己的组件。 - Llewey
这是很棒的信息！不过，他们在那里没有提到介绍模态框或自定义对话框的计划（当然，他们说他们不想让每个扩展开发者重复造轮子，但添加“模态对话框”功能可能是有用的…）。 - Dimitry K
10
「颜色选择器」扩展可以完美地弹出一个对话框。 - Jeff Hernandez
6
看起来不错，感谢提醒 Jeff。然而，他们并不使用标准 API 进行这项操作，他们会在一个独立的 Electron 应用程序进程中生成一个单独的应用，并使用 IPC 在其与主要颜色选择器扩展进程之间进行通信。 - Llewey
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接