TreeView

A TreeView object acts as the interface to working with a custom extension sidebar using a tree style (an outline of objects with disclosure buttons). When you define a tree sidebar, you also create a TreeView object to provide data and respond to events for that sidebar.

The TreeView class conforms to the Disposable interface. Disposing a tree view will unregister it from the sidebar it is linked to and unload its tree of data.

The TreeView class is not subclassable.

// Create the TreeView
let treeView = new TreeView("my-identifier", {
    dataProvider: new MyDataProvider()
});

treeView.onDidChangeSelection((selection) => {
    console.log("New selection: " + selection.map((e) => e.name));
});

treeView.onDidExpandElement((element) => {
    console.log("Expanded: " + element.name);
});

treeView.onDidCollapseElement((element) => {
    console.log("Collapsed: " + element.name);
});

treeView.onDidChangeVisibility(() => {
    console.log("Visibility Changed");
});

Class Methods

constructor(identifier, options)

Creates a new TreeView object. The identifier argument should match the identifier specified for a sidebar section in your extension’s extension.json file.

The options object may have the following values:

Properties

visible

Whether the tree view is currently visible.

This property is readonly.

selection

An array of elements that are currently selected within the tree view.

This property is readonly.

Methods

onDidChangeSelection(callback, [thisValue])

Adds an event listener that invokes the provided callback when the tree view’s selection change. The callback will receive as an argument the array of selected elements.

The optional thisValue argument may be used to set what this is bound to when the callable is invoked. If omitted, this will be undefined.

This method returns a Disposable that can be used to unregister the listener.

onDidChangeVisibility(callback, [thisValue])

Adds an event listener that invokes the provided callback when the tree view’s visibility change.

The optional thisValue argument may be used to set what this is bound to when the callable is invoked. If omitted, this will be undefined.

This method returns a Disposable that can be used to unregister the listener.

onDidExpandElement(callback, [thisValue])

Adds an event listener that invokes the provided callback when the an element is expanded. The callback will receive as an argument the element that was expanded.

The optional thisValue argument may be used to set what this is bound to when the callable is invoked. If omitted, this will be undefined.

This method returns a Disposable that can be used to unregister the listener.

onDidCollapseElement(callback, [thisValue])

Adds an event listener that invokes the provided callback when the an element is collapsed. The callback will receive as an argument the element that was collapsed.

The optional thisValue argument may be used to set what this is bound to when the callable is invoked. If omitted, this will be undefined.

This method returns a Disposable that can be used to unregister the listener.

reload([element])

Causes the tree view to reload the specified element (if it is visible) and any descendants. Invoke this method with no argument (or with a null or undefined argument) to reload the entire tree view. Returns a Promise object that resolves when the reload has finished.

reveal(element, options)

Attempts to reveal the element in the tree.

The options object may have the following values: