CODEWITHSUNDEEP
visual-studio-code
Lemonbonbon
Lemonbonbon

Reputation: 748

VS Code: How to split horizontally with one vertical split

Basic question: I have this layout in VS Code:

A | B

A and B contain multiple files. Now I want this:

A | B
-----
  C

Somehow I am unable to get this layout without manually moving all files around till there is no vertical split anymore. From this point on, I can get to my target layout. Is there a quicker method? Basically, I can only get to these layouts if I try to snap one file to a new location, which is not what I want:

A | B       A | B
--|           |--
C |           | C

Upvotes: 0

Views: 117

Answers (2)

Mark
Mark

Reputation: 182066

Starting with your A | B:

then focus A or B and in the Command Palette trigger the command:

View: New Editor Group Below and you will be at

A | B       A | B
--|           |--
C |           | C

depending on whether A or B was focused.

The commands could be combined into a macro keybindings:

{
  "key": "alt+w",                         // whatever keybinding you want
  "command": "extension.multiCommand.execute",
  "args": {
    "sequence": [
      "workbench.action.newGroupLeft",   // or newGroupRight
      "workbench.action.newGroupBelow"
    ]
  },
}

Using the Multi Command extension. Start with a single editor group.

Upvotes: 1

Martynas J
Martynas J

Reputation: 23

There is pre-configured layout for your case:
View -> Editor Layout -> Two Columns Bottom

For quick access you can create keybinding:
File -> Preferences -> Keyboard Shortcuts
Search for "Two Columns Bottom Editor Layout"

Upvotes: 1

Related Questions