Vscode: Support to split editors horizontally

[SetTrend]

It's hard to read code having more than one editing panel opened when they are split horizontally:





Is it possible to have Code split editor panels vertically?

[mikewl]

+ 1

I use 2 on the left and one on the right in atom often and this is missed in VSCode.

[felixfbecker]

@SetTrend as a tip, if you're not on a 16:9 monitor, you can toggle the side bar with Ctrl+B

[bpasero]

Currently not supported, but a valid feature request.

[nchammas]

I often have VS Code on one half of the screen, and a terminal window on the other half. Splitting VS Code vertically makes the code windows too narrow. A horizontal split would work much better in this case.

[felixfbecker]

Imo it would also be nice to completely undock windows to put them on external monitors. Just the files, no toolbars - similar to how you can do it in Photoshop with panels.

[paul-howard]

+1.

[mrblackus]

+1

[tsjishan]

+1

[tehOPEologist]

+1

[felixfbecker]

Guys there is now a like button on GitHub, lets stop +1ing issues if we dont have anything else to say

[paul-howard]

@felixfbecker Cool! But I had to pull of the desktop version of the site to see it. Doesn't work on mobile yet. :-1:

[nfloersch]

Ideally we would not be restricted... I've enjoyed UltraEdit on Windows allowing me to position the editing panels in whatever split configuration I need... maybe 3 stacked on left, 1 tall panel on the right, or a 2x2 grid, or 1 wide panel across top with 2 half-wide panels on bottom.

Also, going from MDI to SDI layout to support putting panels on different screens seems like a nice addition. I'm not sure if I would use it right now, but I have done that in the past with UltraEdit as well.

As a note, Sublime is not particularly good at doing this stuff, but you can customize it more than VSCode.

[maedoc]

FWIW, coming from Vim and its infinite flexibility, I found VSCode's 3 vertical split limit vastly reduced cognitive load of splitting, switching and cleaning up. Where in Vim, I'd <c-w> ad naseum to get the 'perfect' set up for a particular coding problem and then not change it unless forced to, in VSCode, I found the <c-\>, <c-1> etc made for a much more fluid & adaptable layout, according to the particular context of what I'm working on. This, I think, is a hallmark of the ST/Atom/VSCode paradigm, simple fast & agile with reduced cognitive load.

Since it's blasphemous to argue against configurability, I just make a humble suggestion to leave the defaults as they are and allow he/she who wishes, to opt into the additional complexity.

[mphaney]

Definitely +1 on this issue :-)

[jayrosen1576]

I'm so happy that tabs are finally going to make it into VSCode. Adding the horizontal split pane would be a huge benefit and, at least in my use case, complete all of the necessary features for the type of product development I do daily. I commented on split panes in the tabs discussion so I'll also include it here:

This allows you to have two files opened side by side at the top and one or two opened below them. While this is a not a critical feature, I do find myself missing this quite often while developing front end web apps & mobile apps. The reason is most of what I work on is MVC or derivations thereof so having a model, view, controller and some UI file (css, Js, etc) open at the same time is a huge benefit.

Thanks for all of your hard work. This is truly one of the greatest code editors on the market and it has been a pleasure to use.

[jeffgabhart]

Horizontal split would be nice for people who use portrait monitors.

[winuxue]

Horizontal split would be nice for developers comming from VS

[natdm]

Where is this on the backlog?

[rebornix]

Vim allows users to split window both vertically (similar to our Editor Group) and horizontally, so I see the reason why people are looking forward to it.

However in Vim, Window is always inside Tab but our Tab is inside Editor Group (as I mentioned above, our Editor Group is like Vim's vertical Window). I'm not a fan of doing additional splitting in our Tab again as that will make the UI structure too complex (a horizontal Window inside a Tab inside a vertical Editor Group). Maybe we can just allow Editor Group be horizontal ? @bpasero

[fjunqueira]

Just out of curiosity, where can i check this issue priority in the backlog? I'm really looking forward to this :)

BTW, congrats on the great work :+1:

[odiazjs]

+1 would be great

[Tekbr]

+1

[nefD]

+1

[andfaulkner]

+1

[shioyang]

+1

[stevencl]

We have some early designs for this experience that we would like to share. If you are interested in reviewing these designs with us, please join us on Tuesday 30th August at 16:00 BST on this Google Hangout:
https://hangouts.google.com/call/ez36wxxp35cr3g77rlbuv3mho4e

We will share our designs and ask for your comments and feedback.

[stevencl]

Just a reminder that we will be sharing our designs for horizontal split in just over an hour (16:00 BST today). Join us on the Google hangout to share your feedback about our designs: https://hangouts.google.com/call/ez36wxxp35cr3g77rlbuv3mho4e

[felixfbecker]

I wish this would work without a plugin. Come on MS you own Skype :D

[stevencl]

Thanks to everyone who joined the conversation yesterday to discuss the designs for enabling horizontal split.

We discussed two main design decisions:

• To begin with, we will only support horizontal or vertical splits, not a combination of both. This means that it will not be possible to split one editor horizontally and another vertically. We are doing this as it allows us to more easily introduce vertical splits given the current design. We currently support a maximum of three editor groups and place a button beside the group to allow the user to split this group. If we want to allow a mix of horizontal and vertical splits we will have to reconsider the way that we support splitting editor groups since we need to allow the user to choose which way to split.

Before we go down that path, we want to take this initial step of supporting horizontal editor groups within the current design. We will continue to monitor feedback and usage to determine if we should provide more flexible support for a mix of horizontal and vertical editor groups.

• We propose to place a button on the open editors header area that will allow the user to choose the orientation for each split. See the screenshot below:
  

When the user interacts with this drop down they can choose the orientation that they want to split the editor. The split button on the top right changes in accordance with this toggle so that when the user presses the split button, the editor groups will split according to the orientation selected.

Here are some examples of how things might look with horizontal editor groups.

• Viewing a diff editor
  
• Debugging (note the debug console at the bottom)
  
• Three horizontal editor groups with the debug console visible
  

[fjunqueira]

Nice!

Yesterday on the conf i gave an example of users like me, who prefer editors over tabs (emacs style). To enable this kind of setup, combining horizontal and vertical splits is needed.

Should I create an issue for users to vote on that feature? I know some users would like it, but i also know maybe there are not enough users out there who want it to make it worth implementing.

Anyway, thanks for hearing our feedback! :)

[iRoachie]

@fjunqueira 2nd with that. I love this functionality in all the jbrains editors, even in atom. My setup usually has:

HTML
Sass Module | Sass Variables

Super efficient, then having to reopen and switch files all the time.

[Namek]

I don't see a need to convince anyone here but look how I work at the moment:

I feel claustrophobic, heh.

Don't forget about key shortucts for splitting horz/vert and switching between. Mouse should be optional, I believe.

[Pepsi4]

Waiting for you, guys!
Good luck with it.

[i-frost]

Let me know when to recompile to get Horizontal splits:-)

[bpasero]

This will not happen for September and continue in October.

[stpettersens]

+1 for horizontal split.

[natdm]

Why are people still +1ing this when it's already going to happen? We're already getting our way soon enough.

[felixfbecker]

@natdm the question should be why are people +1ing in general when we have this:

It just spams maintainers with notifications, clutters the thread and doesn't add any value to the discussion.

[gold]

What a waste of time to have a design review for horizontally split windows; there are many editors that already do this. Just implement it and save everyone who need this feature. As imperfect as you may think your initial implementation may be, don't worry -- just stand on the shoulders of (dated) giants like Emacs to see how it's done, with infinite flexibility.

In this case having something imperfect is 100% better than nothing at all. Just do it!!

P.S. Overall I love this editor, having used Emacs for many years, then Sublime for a year, then Atom for six months, and now VS Code. Keep up the great work.

[Tyriar]

@gold it's not just as simple as implementing it, many parts of VS Code are designed under the assumption that there are only ever 1-3 vertical editors. The design review answers important questions like:

• How do the currently navigation keybindings play with horizontal editors?
• Can horizontal editors exist are the same time as vertical editors?
• Are git diffs shows as horizontal editors?
• Anything else the team brings up.

While it makes sense for some features to get them out there and iterate on the feedback, this one has broader implications that should be worked through or we run the risk of shipping a buggy product which ultimately costs the team more time to get right.

[geddski]

What's the verdict on this? Evaluating VS Code vs my regular editor (Atom) and this is a deal breaker for my prefs.

[Tyriar]

@geddski you can test it out now in the Insiders build, it will be landing in the stable release in around 1-2 weeks. shift+alt+1 or a button in the "open editors" section will toggle it.

[geddski]

Awesome thx!

[eddiemonge]

Its only one way or the other now? Thats almost as limited.

[danwulff]

@eddiemonge, Above they discussed how the current design of the editor makes flexibility a bit limited for this kind of design change, but @stevencl did mention that they'd be monitoring feedback and usage, and would consider making additional changes in the future. So specifying what you're looking for would help designate what they do in the future.

Before we go down that path, we want to take this initial step of supporting horizontal editor groups within the current design. We will continue to monitor feedback and usage to determine if we should provide more flexible support for a mix of horizontal and vertical editor groups.

[eddiemonge]

There are only two things keeping me from switching to VSC right now. The first is the limited flexibility in splitting. I run 27" 4K monitors in portrait so having both splits is essential for me. The other is why the heck can't I hide the left toolbar. It takes up valuable space

[bgashler1]

@eddiemonge we don't currently have grid layout, but in the latest Insiders Build we do allow you to hide the left toolbar (activity bar). Go to View > Hide Activity Bar.

In the Insiders Build we also just introduced a "Focus Mode" or Zen Mode that hides everything but the editors and tabs. Hope that helps :)

[vviikk]

Would defo like the ability to have 4 panes. 3 seems a little to small a number consider I have so much real estate.

[Shahor]

I like to be able to split both vertically and horizontally and this is really missing here :(

Hopefully it will be implemented. This is the only major problem I have with vscode right now.

[nambrot]

Please provide your feedback at https://github.com/Microsoft/vscode/issues/14909 to centralize issues around the limitation of having to choose between vertical and horizontal splitting

[DHirani]

It is now a year and still no support for this feature which should have existed from the start, can we please get this added.

[Tyriar]

@BuddyWork this feature was out in v1.7, you can toggle it via command palette or alt+shift+1. The command's name is workbench.action.toggleEditorGroupLayout.

[R3V07T]

N30

On Thursday, January 5, 2017, Daniel Imms [e-mail] wrote:

@BuddyWork https://github.com/BuddyWork this feature was out in v1.7,
you can toggle it via command palette or alt+shift+1. The command's name is
workbench.action.toggleEditorGroupLayout.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/Microsoft/vscode/issues/1749#issuecomment-270653425,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AXjFUDlof9WSJZ0oPrTCehlhR4KuexJ3ks5rPPtNgaJpZM4G9n5r
.

[R3V07T]

context

On Thursday, January 5, 2017, Ricky Rage [e-mail] wrote:

N30

On Thursday, January 5, 2017, Daniel Imms <[email protected]

@BuddyWork https://github.com/BuddyWork this feature was out in v1.7,
you can toggle it via command palette or alt+shift+1. The command's name is
workbench.action.toggleEditorGroupLayout.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/Microsoft/vscode/issues/1749#issuecomment-270653425,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AXjFUDlof9WSJZ0oPrTCehlhR4KuexJ3ks5rPPtNgaJpZM4G9n5r
.

[LinuxDev69]

There is no point replying to @BuddyWork, it's just a bot that is posting similar inflammatory comments on bugs all around the Internet. Notice how the comment is generic and could apply to all kinds of bugs, not just this one.

The bot started out posting things like "X is not interested in fixing bugs" (where X is the assignee) on Bugzilla bugs. After that it started searching for bugs which mentioned Linux, and posting a long screed about why you should say GNU/Linux instead. Now it seems to have been rewritten to spam bugs on Github (and Gitlab) instead.

At one point the bot source code was actually available on Github, which was cheeky, but the repository and the organization behind it have now been deleted.

[nilssanderson]

Just want to thank everyone that worked on this!

Great addition to a brilliant editor.

[btoo]

Is there any way we could have both horizontally and vertically split panes at the same time?

ex. 2 panes on the top half and one on the bottom

[gold]

Yes. Atom editor

On Apr 4, 2017 16:42, "btoo" [e-mail] wrote:

Is there any way we could have both horizontally and vertically split
panes at the same time?

ex. 2 panes on the top half and one on the bottom

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/Microsoft/vscode/issues/1749#issuecomment-291625570,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAMNA6i3hr7L_6HtKjf3Xm7oc_YCTIhnks5rsqsogaJpZM4G9n5r
.

[R3V07T]

What editor?

Sent from Mail for Windows 10

From: btoo
Sent: Tuesday, April 4, 2017 1:42 PM
To: Microsoft/vscode
Cc: Ricky Rage; Comment
Subject: Re: [Microsoft/vscode] Support to split editors horizontally (#1749)

Is there any way we could have both horizontally and vertically split panes at the same time?
ex. 2 panes on the top half and one on the bottom
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[R3V07T]

Right click split up down left right or use 2 windows

Sent from Mail for Windows 10

From: Ricky Rage
Sent: Tuesday, April 4, 2017 11:35 PM
To: Microsoft/vscode
Cc: Ricky Rage; Your activity
Subject: Re: [Microsoft/vscode] Support to split editors horizontally (#1749)

What editor?

Sent from Mail for Windows 10

From: btoo
Sent: Tuesday, April 4, 2017 1:42 PM
To: Microsoft/vscode
Cc: Ricky Rage; Comment
Subject: Re: [Microsoft/vscode] Support to split editors horizontally (#1749)

Is there any way we could have both horizontally and vertically split panes at the same time?
ex. 2 panes on the top half and one on the bottom
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub, or mute the thread.

[spring1975]

@felixfbecker Undocking windows is absolutely a miss in VSCode when coming VS. VSCode on a dual monitors (or more) system is fairly restrictive.

There's a workaround of stretching VSCode across both monitors and then splitting the editor horizontally, but that's not nearly as nice as an undocked editor window like what VS supports.

[RoyHP]

Would love the ability to split both horizontally and vertically at the same time with a grid layout, much like Atom.io has (also Electron based). I won't be switching until this happens unfortunately.

[eduncan911]

Coming from old-school VIM and VS, Sublime and Atom w/VIM plugins... It's a serious limitation to not be able to:

:vs 
:vs 
:split

Translation to non-VIM gurus: it's an echo to the rants in this thread about not being able to split Vertically AND Horizontally - to form a grid-like editor, like mentioned in #14909.

Enough with the "design reviews" - just enable the features that all other editors have, and be done with it. If you have to change the infrastructure and groupings of tabs or whatever, make it a major version bump and tell everyone why. Done.

It's so frustrating that I tend to just use VS code for lighting editing, and drop to a terminal for hardcore grid editing.

On my 4k 30", or on my Macbook Pro 15" Retina - I use the grid layout exclusively.

Undocking windows would be a big plus too. But right now, I still have to use vim - so I have console open with tmux across my 3 three monitors for now - since VSCode doesn't support the 'grid layout' of horizontal and vertical splits at the same time.

[erraX]

+1

[aph-vsn]

+1

[aph-vsn]

Need to be able to split 4 plus editors

[yosefrow]

+1

[AshleyRodanHP]

It just reverted with the last update.
Last update i would cmd+1 and it would split it vertically and now when i do cmd+1 it splits it horizontally.

Id ont see any option in my setting to change this. Was looking for toggleEditorGroupLayout with no avail. :/

Current version is Version 1.14.0 (1.14.0)

[jorgebucaran]

⌘+Option+1 on macOS or Shift+Alt+1 on Windows.

[brucejo75]

The usage description was confusing to me.

errr... I was banging on shift+alt+1 and then tried entering the toggle command in the command palette to no avail (no new window would split for me)... Luckily I toggled it an odd number of times so my next window split was then vertical. D'oh!!

To be EXACT:

1. There are 2 modes for splitting the screen, horizontal or vertical. Horizontal (side by side) is default. To switch the mode use the shift+alt+1 on windows or ⌘+Option+1 on mac.
2. There is a separate command to actually split the windows: ctrl+\ or cmd+\ for mac.

Once you have split windows on the screen you can toggle their modes (1) and the split will move. If you do not have any screens split then toggling will just toggle the mode for the next time you split your screen with (2).

Suggestion

If the screens are not split, toggling the mode (1)...shift+alt+1 will split the screen just like a screen split (2)... ctrl+\. I think this would make this feature much more discover-able.

[taivu]

is there a preference setting in json that will allow me to split horizontal by default? i had to google search to remember to do cmd+option+1

[aadamsx]

This issue seems related to #5911. I'll post the same comment here just in case:

Why has this feature not implemented?

This is a big, important, critical feature and the last one I can find that Atom has but VSCode does not.

Just implement split view (both horizonal/vertical at the same time) just as Atom -- they did a great job IMO.

This is the only reason I don't use VSCode over Atom, as I have 2 - 32" - 4K screens and can easily accomodate both vertical and horizonal "windows" or "views" -- it's a must have feature.

[wpowers]

@aadamsx

Why has this feature not implemented?

Agreed, this thread is approaching two years old and the requests in here are beginning to feel like begging. What has to happen to resolve this?

[stevencl]

We implemented the ability to split horizontally or vertically and released that almost a year ago. Prior to this we did not support horizontal splits. At the time we discussed the approach we were taking and the reasons why we did not implement the ability to split both vertically and horizontally.

We are aware that some people would like more flexibility and we understand the motivation for this. But as I mentioned here: https://github.com/Microsoft/vscode/issues/5911#issuecomment-328063678, we have a large list of items that we need to get done such as multi root. Many of these items have significant impact throughout the rest of the product so we make sure to take our time to do them properly.

Supporting more flexible layouts than we support currently is a large piece of work since there is some significant UX work required to make sure we get it right then engineering work to implement it. However, we're focusing on getting multi root done just now (this is a large effort) so we will not be able to devote attention to this in the near future unfortunately.

[R3V07T]

Take it off full screen thats why it dont work how you want it to