vscode树模型例子

简介: vscode树模型例子

树模型文件:

MyTreeProvider.ts

import * as vscode from 'vscode';
import { createSecureServer } from 'http2';
import { MenuItemProvider } from './menuitemprovider';
export class MyTreeProvider implements vscode.TreeDataProvider<myTreeNode> {
    public static tree: myTreeNode[] = [];
    public opn = require('opn');
    public static iconName = "C:\\Users\\Desktop\\code-1227\\WeCodeForVSCode\\code\\media\\image\\unHandle.png";
    public static mrfiles: myTreeFilesNode[] = [{ fileName: "test1.cpp" }, { fileName: "test2.cpp" }];
    constructor() {
    }
    public static initMyTreeList() {
        let myTreeProvider = new MyTreeProvider();
        vscode.window.registerTreeDataProvider("A_ID", myTreeProvider);
        MyTreeProvider.tree.push(new myTreeNode("SunXiangModel", vscode.TreeItemCollapsibleState.Collapsed, MyTreeProvider.mrfiles, myTreeKind.MR),
                       new myTreeNode("TuMiaoModel", vscode.TreeItemCollapsibleState.Collapsed, this.mrfiles, myTreeKind.MR));
        let myTreeProvider2 = new MenuItemProvider();
        vscode.window.registerTreeDataProvider("B_ID", myTreeProvider2);
        vscode.window.registerTreeDataProvider("C_ID", myTreeProvider2);
    }
    getTreeItem(element: myTreeNode): vscode.TreeItem {
        return element;
    }
    getChildren(element?: myTreeNode): Thenable<myTreeNode[]> {
        let trees: myTreeNode[] = [];
        if (element == undefined) {
            if (MyTreeProvider.tree != undefined) {
                for (let i = 0;i < MyTreeProvider.tree.length; i++) {
                    let currentElement = MyTreeProvider.tree[i];
                    if (currentElement.label == "SunXiangModel") {
                        let temp: myTreeNode = new myTreeNode(currentElement.label, vscode.TreeItemCollapsibleState.Collapsed, MyTreeProvider.mrfiles, myTreeKind.MR, {
                            command: "test1",
                            title: "test1"
                        });
                        temp.contextValue = 'sxTreeNode';
                        temp.tooltip = 'sxTreeNode';
                        temp.iconPath = currentElement.iconPath;
                        trees.push(temp);
                    }
                    if (currentElement.label == "TuMiaoModel") {
                        let temp: myTreeNode = new myTreeNode(currentElement.label, vscode.TreeItemCollapsibleState.Collapsed, MyTreeProvider.mrfiles, myTreeKind.MR, {
                            command: "test2",
                            title: "test2"
                        });
                        temp.contextValue = 'tmTreeNode';
                        temp.tooltip = 'tmTreeNode';
                        temp.iconPath = currentElement.iconPath;
                        trees.push(temp);
                    }
                }
            }
        } else {
            if (element.kind == myTreeKind.MR) {
                for (let i = 0;i < element.mrFiles.length; i++) {
                    let currentElement = element.mrFiles[i];
                    let mrreviewnode: myTreeNode = new myTreeNode(currentElement.fileName, vscode.TreeItemCollapsibleState.Collapsed, [], myTreeKind.file);
                    trees.push(mrreviewnode);
                }
            } else if (element.kind == myTreeKind.file) {
                let mrissue_node = new myTreeNode('comment', vscode.TreeItemCollapsibleState.None, [], myTreeKind.comment);
                trees.push(mrissue_node);
            }
        }
        return new Promise(resolve => {
            return resolve(trees);
        })
    }
}
export interface myTreeFilesNode {
    fileName: string;
}
export enum myTreeKind {
    MR,
    file,
    comment,
    catatory,
    issue
}
export class myTreeNode extends vscode.TreeItem {
    constructor(
        public readonly label: string,
        public readonly collapsibleState: vscode.TreeItemCollapsibleState,
        public readonly mrFiles: myTreeFilesNode[],
        public readonly kind: myTreeKind,
        public readonly command?: vscode.Command
    ) {
        super(label, collapsibleState);
    }
}

MenuItemProvider.ts

import * as vscode from 'vscode';
import * as path from 'path';
export class MenuItemProvider implements vscode.TreeDataProvider<MenuItemNode> {
    constructor() {
    }
    getTreeItem(element: MenuItemNode): MenuItemNode{
        return element;
    }
    getChildren(element?: MenuItemNode): vscode.ProviderResult<MenuItemNode[]> {
        if (element == null) {
            let trees = [];
            let menuItemList = [{"command":"WeCode.PrivateBuild", "icon":"", "lable": "ATLAS构建配置"}];
            for (let i = 0; i < menuItemList.length; i++) {
                let treeItem = new MenuItemNode(menuItemList[i].lable, vscode.TreeItemCollapsibleState.None, {            
                    command: menuItemList[i].command,
                    title: menuItemList[i].command,
                    arguments: ["123", "asd"]
                });
                //treeItem.contextValue = 'IssueNode';
                //treeItem.tooltip = currentElement.tooltip;
                //treeItem.iconPath = currentElement.iconPath;
                trees.push(treeItem);
            }
            return trees;
        }
        return null;
    }
}
export class MenuItemNode extends vscode.TreeItem {
    constructor(
        public readonly label: string,
        public readonly collapsibleState: vscode.TreeItemCollapsibleState,
        public readonly command?: vscode.Command
    ) {
        super(label, collapsibleState);
    }
}

extension.ts:

效果如图:

相关文章
|
8月前
|
存储 开发工具 git
Vscode 拉取代码时出现 在签出前 请先清理仓库工作树
Vscode 拉取代码时出现 在签出前 请先清理仓库工作树
733 0
|
Go
VSCode资源管理器文件树缩进配置
VSCode文件树缩进太小,看上去一点都不清晰
1494 0
VSCode资源管理器文件树缩进配置
|
8月前
sublime和vscode 推荐安装的插件
sublime和vscode 推荐安装的插件
107 0
|
8月前
|
人工智能 自然语言处理 算法
国产新型AI编程助手—DevChat AI插件在VSCode中的应用
国产新型AI编程助手—DevChat AI插件在VSCode中的应用
278 0
|
8月前
|
敏捷开发 人工智能 前端开发
让你爽到飞起的【懒人插件AutoScssStruct4Vue】VSCode根据template的标签目录自动一键生成CSS/SCSS/LESS结构,敏捷开发必备插件!!!
让你爽到飞起的【懒人插件AutoScssStruct4Vue】VSCode根据template的标签目录自动一键生成CSS/SCSS/LESS结构,敏捷开发必备插件!!!
|
8月前
|
前端开发
解决适配375像素宽度667像素高度移动端方法:推荐一款非常好用的px转rem单位的VSCode插件px to rem & rpx (cssrem)
解决适配375像素宽度667像素高度移动端方法:推荐一款非常好用的px转rem单位的VSCode插件px to rem & rpx (cssrem)
|
8月前
|
人工智能 JavaScript 程序员
Fitten Code:在VSCode插件市场备受欢迎的原因是什么?
随着AI技术的不断发展,AI在编写代码方面的能力也日益强大。充分利用AI的能力能够显著提高代码编写的效率和质量。今天我将向大家介绍一款备受瞩目的AI代码神器——Fitten Code,让我们一同揭开它神秘的面纱!
613 3
|
7月前
|
前端开发
VSCode中自带插件Emmet的用法
Emmet 是一个强大的工具,集成在 Visual Studio Code (VSCode) 中,可以大大提高编写 HTML 和 CSS 的效率。以下是如何使用 Emmet 插件的一些基本方法
104 4
|
7月前
|
传感器 前端开发 JavaScript
前端开发者必备的VS Code插件推荐
前端开发者必备的VS Code插件推荐
|
8月前
|
Web App开发 XML 传感器
VSCode 开发Vue必备插件
VSCode 开发Vue必备插件
239 0

热门文章

最新文章