What is this arrow in the code editor's gutter that allows collapsing code blocks called? How can I collapse arbitrary blocks?


What do you call this?

screenshot of the arrow

I want to organize my code, and be able to click that little arrow and shadow certain things onto it, take this for example, I want to hide it under my comment # Words like this:

screenshot of what I want to hide

I use visual studio code and I’m working with python.

Some keywords that might be related: Bookmarks, whatever popovers are, and ‘ribbons’.

Asked By: Judah Starkenburg



This is called "code folding".

To do it with arbitrary blocks of lines of code, there is built-in functionality for some programming languages, which you can read more about in the VS Code docs on editor folding regions. The general patterns is that you create "marker" comments around the block: one like #region, and one like #endregion. The current languages supporting markers at the time of this writing (according to the documentation) are JS, TS, C#, C, C++, F#, PowerShell, and VB.

For other languages, you should be able to achieve that with the maptz.regionfolder extension or other similar ones.

Answered By: starball