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

总结

官方文档很详细，看官方文档吧。这里只是简单记录下