VSCODE插件开发:用户输入输出
阅读这篇文章之前,假设你已经具有开发helloworld的插件的能力。
vscode.window 简介
vscode.window
负责当前激活窗口的输入输出,比如展示信息,和用户输入等功能都是用vscode.window实现
代码输出提示信息
简单的输出提示信息
使用vscode.windows.showInformationMessage('Hello World!')可以进行简单输出信息展示。
let disposable = vscode.commands.registerCommand('extension.sayHello', () => {
// Display a message box to the user
vscode.window.showInformationMessage('Hello World!');
});
效果如下:
示例代码在官方文档中也可以找到,Example-hello world:https://code.visualstudio.com/docs/extensions/example-hello-world
带有选择项的输出提示信息
如果提示信息想带回用户的选择怎么办,参考以下代码
let disposable = vscode.commands.registerCommand('extension.sayHello', function () {
vscode.window.showInformationMessage("请问你现在的心情如何",'你说什么','我不知道','再见!')
.then(function(select){
console.log(select);
});
});
在提示信息后面紧跟上给用户的选择项,然后用then接收即可
效果如下:
不同类型的输出
官方提供了三种不同类型的信息输出方法
分别是:
- showInformationMessage()
- showErrorMessage()
- showWarningMessage()
三个的用法基本类似,提示框的样式会有区别
状态栏设置
使用vscode.windows.setStatusBarMessage设置状态栏提示信息
let disposable = vscode.commands.registerCommand('extension.sayHello', function () {
vscode.window.setStatusBarMessage('今天也要快乐鸭!~',3000);
});
额,写这些有什么意义?官方文档很清晰了好吗,不想写了。
官方文档地址:https://code.visualstudio.com/docs/extensionAPI/vscode-api#window.setStatusBarMessage
用户输入
字符串输入
使用vscode.window.showInputBox()打开一个输入框让用户输入信息
let disposable = vscode.commands.registerCommand('extension.sayHello', function () {
vscode.window.showInputBox(
{ // 这个对象中所有参数都是可选参数
password:false, // 输入内容是否是密码
ignoreFocusOut:true, // 默认false,设置为true时鼠标点击别的地方输入框不会消失
placeHolder:'你到底想输入什么?', // 在输入框内的提示信息
prompt:'赶紧输入,不输入就赶紧滚', // 在输入框下方的提示信息
validateInput:function(text){return text;} // 对输入内容进行验证并返回
}).then(function(msg){
console.log("用户输入:"+msg);
});
});
界面效果如下:
选择本地文件
使用vscode.window.showOpenDialog()用来选择本地文件
let disposable = vscode.commands.registerCommand('extension.sayHello', function () {
vscode.window.showOpenDialog(
{ // 可选对象
canSelectFiles:true, // 是否可选文件
canSelectFolders:false, // 是否可选文件夹
canSelectMany:true, // 是否可以选择多个
defaultUri:vscode.Uri.file("/D:/"), // 默认打开本地路径
openLabel:'按钮文字说明'
}).then(function(msg){
console.log(msg.path);
})
});
官方文档:https://code.visualstudio.com/docs/extensionAPI/vscode-api#window.showOpenDialog
打开选择框
let disposable = vscode.commands.registerCommand('extension.sayHello', function () {
vscode.window.showQuickPick(
[
"哈哈哈,你是傻逼吗",
"哈哈哈,你是二逼么",
"你他妈有病吧",
"乖,你是妈的智障"
],
{
canPickMany:true,
ignoreFocusOut:true,
matchOnDescription:true,
matchOnDetail:true,
placeHolder:'温馨提示,请选择你是哪种类型?'
})
.then(function(msg){
console.log(msg);
})
});
官方文档:https://code.visualstudio.com/docs/extensionAPI/vscode-api#window.showQuickPick
总结
官方文档很详细,看官方文档吧。这里只是简单记录下
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY