Vscode: Indent guides

Created on 22 Jan 2016  路  36Comments  路  Source: microsoft/vscode

Hi, is there any chance we can get indent guides (the vertical lines that run down to matching indents). Could not find reference to them anywhere in VS code or the gallery. Thanks - Adolfo

editor feature-request

Most helpful comment

Behind editor.renderIndentGuides

image

All 36 comments

Do you mean like it describes in this issue https://github.com/Microsoft/vscode/issues/1673 ?

Hi greybax, No, but thanks for the response :) ...let me see if i can draw it out here:


  • .


    . . slkdfjkldsfaksdflkdasjf
    . .

    . . alsdkfjieakegan;eikgie
    .


  • The guides are the dots that help align the tags above.

    ok that did not work...lol. Basically they are lines or dots that connect open and closing tags. they help you align the code.

    I think you're wanting something like the Indent Guides extension for Visual Studio?

    screen

    However, I find that if you turn on whitespace rendering by setting the "editor.renderWhitespace" setting to true, you get something that works almost just as well:

    whitespace

    It shows arrows for tabs and small dots for spaces

    Hi yes...that's it. Thank You!

    +1

    I really think that indent guide (vertical lines) would be useful.

    :+1:

    @stkb has it with his reference to the Visual Studio extension. Would love to see a similar extension for vscode.

    Aside from the actual indent guide lines, a separate color for the lines in the currently active indent level (cursor line) really pluses the experience up.

    I'm looking into the extension @JoeRobich is working on: vscode-indent-guides

    This will also address #3803, where users have had trouble seeing where the left edge of the code editor is and where subsequent tabs are (especially with smaller tab sizes).

    This extension solves the problem

    @alexandrudima see https://github.com/Microsoft/vscode/issues/6470, indent guides are essentially done by vscode-guides with the exception of this issue https://github.com/spywhere/vscode-guides/issues/1 which we could tweak the API to cover.

    I would like to see Indent Guides in Visual Studio Code.

    agree with @poetinha that it shouldn't be as extension. This is a basic functionality most of IDEs

    Also agree with @poetinha. I think this functionality is standard enough that it should be part of the application itself.

    I will say that the vscode-guides extension does work pretty well in the interim, though. It gets a little bit confused do some swapping back and forth between tabs/spaces, but I do that fairly rarely, and the extension always catches up automatically and gets back to normal.

    Yes please ! Indentation Guides are needed!

    I would also love to see this natively implemented! This is such a great editor!

    Behind editor.renderIndentGuides

    image

    @alexandrudima How to set the indent guide color?

    Access to the indent styling in general through the standard settings would be great. I love the indents, but they're pretty distracting compared to other indent lines I'm used to. Access to change the opacity, specifically, would be awesome.

    Also being able to highlight a selected indent guide would be great for navigating longer code blocks.

    @shauntrennery can you create a dedicated issue for your idea? Also please tag it feature-request. It's a great idea! Thanks.

    @bgashler1 Added #14017, sorry not sure how to tag it.

    Hi. I've experienced some issues with the extension in large files [#19982]. So I'm also asking for native support for this feature as it's a pretty basic need of every developer out there.

    @mosajjal native support was added some time ago https://github.com/Microsoft/vscode/issues/2192#issuecomment-229410639

    I just found it in the configuration. Thanks :)

    Guides can try it.

    @gatspy Guides can cause #19982

    "editor.renderIndentGuides": true

    "editor.renderWhitespace": "all"

    Used to show dots for spaces and arrows for tabs, new version doesn't have this, how do I reenable it?

    "editor.renderWhitespace": "boundary" works for me in 1.11

    @mosajjal I'm on the git version, and there it doesn't work anymore. I'm 2 days behind though, maybe it's fixed by now, I'll see about compiling the new version.
    Version 1.12.0
    Commit 5e5e9e3bb56a3182e58ad097e107966633643253

    EDIT: Latest version ( 4c5030a343f6934912d2eff375f87b8cf2f2ea3f ) still has this problem. I guess I should make an issue?
    EDIT2: Seems to be caused by the python extension I use, outside of python it works

    @M-Fasciano worked ++++1

    ident guides!!! plz!!!!

    Was searching for this. Thanks!

    Thanks, worked 1.12.2

    Would be great to see it also in "Explorer" panel...

    Would be great to also have an option to show the guides only on hover. In most cases I don't need them and they add noise, but if I need them I should just be able to hover over the indentation whitespace and have them appear.

    Was this page helpful?
    0 / 5 - 0 ratings

    Related issues

    philipgiuliani picture philipgiuliani  路  3Comments

    borekb picture borekb  路  3Comments

    sirius1024 picture sirius1024  路  3Comments

    curtw picture curtw  路  3Comments

    vsccarl picture vsccarl  路  3Comments