Interface TreeDecorator

The TreeDecorator allows adapting the look and the style of the tree items within a widget. Changes are reflected in the form of decoration data. This decoration data is a map storing TreeDecoration.Data for affected tree nodes (using the unique node id as key). It is important to notice that there is no common contribution point for TreeDecorators. Instead, each TreeDecoratorService is supposed to declare its own contribution provider for TreeDecorators.

Example usage

A simple tree decorator that changes the background color of each tree node to red.

@injectable()
export class MyTreeDecorator implements TreeDecorator {
    id = 'myTreeDecorator';

    protected readonly emitter = new Emitter<(tree: Tree) => Map<string, TreeDecoration.Data>>();

    get onDidChangeDecorations(): Event<(tree: Tree) => Map<string, TreeDecoration.Data>> {
        return this.emitter.event;
    }

    decorations(tree: Tree): MaybePromise<Map<string, TreeDecoration.Data>> {
        const result = new Map();

        if (tree.root === undefined) {
            return result;
        }
        for (const treeNode of new DepthFirstTreeIterator(tree.root)) {
            result.set(treeNode.id,<TreeDecoration.Data>{backgroundColor:'red'})
        }
        return result;
    }
}
Copy