visual-studio-codevscode-extensions

Visual Studio Code: How to add checkbox in view container


I've been searching non-stop for this on the documentation but haven't been able to find any sort of information. I would like to know how to add checkboxes in my custom view container, similar to the breakpoints' checkboxes.

Checkbox example


Solution

  • You can simulate the checkbox by playing with the icon, create a new TreeItem with a different icon when clicked.

    Somehow they have knowledge on where on the TreeItem you click.

    Looking with the dev tools, it is an <input type="checkbox"/>.

    This means that you can do more with TreeItems than the docs explain.

    Looking at the source code the BreakpointView is not implemented with a TreeItemProvider, it extends the ViewPane class and uses some kind of templates to render an item. Beside a checkbox it is also possible to have a combobox (SelectBox class).

    I have added a feature request (101175) to extend the vscode API so extension developers can write Views with ViewItems that have additional UI-Elements like the Breakpoint view.