Keywords: Visual Studio Code | Editor Splitting | Vertical Layout
Abstract: This article provides a detailed exploration of methods to achieve vertical editor splitting in Visual Studio Code, covering shortcut keys across different versions, menu configurations, command palette usage, and settings customization. Based on official documentation and community best practices, it offers a complete guide from basic operations to advanced adjustments, helping developers optimize multi-file editing efficiency according to their needs.
Version Evolution and Shortcut Changes
The editor splitting feature in Visual Studio Code has undergone significant changes across versions. In earlier releases, the menu View → Split Editor defaulted to vertical splitting, but updates shifted it to horizontal. Users can revert to vertical layout using specific shortcuts.
Shortcuts in Version 1.20 and Later
Starting from version 1.20, the shortcut for vertical splitting is standardized as:
- Windows and Linux: ALT+SHIFT+0
- Mac: ⌘+⌥+0
This key combination toggles the editor group layout directly, eliminating reliance on menu navigation.
Shortcuts in Pre-1.20 Versions
In versions prior to 1.20, vertical splitting used different shortcuts:
- Windows and Linux: ALT+SHIFT+1
- Mac: ⌘+⌥+1
After upgrading, users must adapt to the new shortcuts to avoid operational confusion.
Grid Layout in Version 1.25
Version 1.25 introduced the grid editor layout, accessible via View → Editor Layout menu. This feature allows more flexible arrangements, supporting multi-column and multi-row configurations. For example, the following code demonstrates how to switch layouts via the command palette:
// Example: Switching layout via command palette
// Type "Toggle Editor Layout" and select vertical option
The official release notes elaborate on the benefits of grid layout, ideal for complex project management.
Advanced Configuration in Version 1.58.2
In newer versions like 1.58.2, vertical splitting is further integrated into workflows:
- Menu Path:
View→Editor Layout→Flip Layout, enabling direct toggling between horizontal and vertical layouts. - Command Palette: Enter "Toggle Vertical/Horizontal Editor Layout" for quick execution.
- Settings File: Users can customize shortcuts in
settings.json, for instance:
{
"key": "alt+cmd+0",
"command": "workbench.action.toggleEditorGroupLayout"
}
This configuration ensures shortcut consistency across environments, enhancing user experience.
GUI Operations Supplement
Beyond shortcuts, the GUI interface offers convenient operations. For example, hovering over the OPEN EDITORS group in the explorer pane reveals a layout toggle button, allowing switching between horizontal and vertical with a click. This method suits users who prefer visual interactions without memorizing complex shortcuts.
Best Practices and Conclusion
Vertical editor splitting significantly boosts efficiency in multi-file editing, particularly for code comparison and reference documentation. Users are advised to select appropriate methods based on their version and leverage settings for personalization. By combining shortcuts, menus, and the command palette, developers can build an efficient workspace that adapts to Visual Studio Code's evolving features.