Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add more indentation in the explorer file tree structure?

How to add more indentation in a file tree structure? It has a little bit indentation I want to increase more just like NetBeans.

check the image

enter image description here

like image 396
Akshay Kumar Avatar asked Oct 05 '22 15:10

Akshay Kumar


2 Answers

Go to File > Preference > Settings and choose:

Workbench › Tree: Indent

Controls tree indentation in pixels.

or (in your settings.json enter this directly)

 "workbench.tree.indent": 10

and choose a high enough number for you.

Also see my answer at Visual Studio code sidebar Vertical guideline (customize sidebar) where with v1.36 you can add colorized tree indent guides to make the explorer file structure more obvious.

demo of explorer guidelines

The example picture uses: "tree.indentGuidesStroke": "#00ff00" in the colorCustomizations, so the guidelines will appear green.

{                                         // in settings.json
  "workbench.colorCustomizations": {
    "tree.indentGuidesStroke": "#00ff00"
}

In a small change coming to v1.64 note that the minimum tree indent will be raised to 4 from 0 previously. So you will not be able to go less than 4.

like image 598
Mark Avatar answered Oct 19 '22 16:10

Mark


If you just want to change the indentation you can set these options:
Press Ctrl+Shift+P -> Go to Preferences: Open Settings (JSON)

"workbench.tree.indent": 18,

You can add guidelines as well with:

"workbench.tree.renderIndentGuides": "always",

You can also change their color using:

"workbench.colorCustomizations": {
    "tree.indentGuidesStroke": "#008070"
},
like image 46
Addison Avatar answered Oct 19 '22 18:10

Addison