在vscode中如何向状态栏添加多个选项

Question

I am planning to add multiple options to the status bar. Is it possible?

Like, If we click on the language type of a file we see multiple options in the same way.

how to create it?

Thanks

Answer 1

Use vscode.window.createStatusBarItem to place an item on the status bar. When the item is clicked, it runs a command, that itself runs vscode.window.showQuickPick to prompt the user to select from a list of items.

export function activate(context: vscode.ExtensionContext)
{
    createStatusBarItem(context) ;
}

function createStatusBarItem(context: vscode.ExtensionContext)
{
    // register a command that is invoked when the status bar
    // item is clicked.
    const myCommandId = 'myExtension.statusBarClick';
    context.subscriptions.push(vscode.commands.registerCommand(myCommandId, async () => 
    {
        const pageType = await vscode.window.showQuickPick(
            ['shell', 'fetch rows, list in table'],
            { placeHolder: 'select type of web page to make' });

    }));

    // create a new status bar item that we can now manage
    const item = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, 100);
    item.command = myCommandId;

    context.subscriptions.push(item);

    item.text = `my command`;
    item.tooltip = `status bar item tooltip`;
    item.show();
}