Floating windows in vscode for editor and terminal
Table of Contents
Introduction
Watching the vscode day 2024 keynote, I discovered a new feature that allows you to float windows in vscode! Turns out this has been around since November 2023 (version 1.85). What is even cooler is that you can float terminal windows.
How to float a window
The easiest way to float a window is to drag the tab outside of the vscode window. You can also right-click on the tab and select Move to New Window. This will pop up a new window with the tab you selected. Here is the tab for this blog post in a floating window:
What’s more, you can use the Copy into new window command to bring up a new window with the same content as the current window. This can be useful if you want to refer to another part of the codebase:
Preview markdown files in a floating window
One handy use case for me is to preview markdown files. With the markdown preview open, clicking on this tab and selecting Move to New Window will open the preview in a floating window. This is useful if you want to keep the preview open while you continue to edit the markdown file.
Terminal in a floating window
Also during the keynote demo, I noticed that they floated the terminal window! You can achieve this by clicking on the process tab and selecting Move Terminal into New Window giving you more real estate for the terminal output:
Snap to window
One other nice side feature here is that you can snap the floating window back to the main window - if you drag the second window towards the top edge of the main window it will lock in place alongside the main windows edge, you can then bring the bottom edge down to the bottom of the main window and it will snap into place.
To be honest, I do not know whether this is a feature of vscode or the OS, or even the window manager app I use (called Magnet) is doing this!
Wrapping Up
This is a really nice find, unfortunately I tried to also do this in Azure Data Studio and it does not work there. Hopefully, this feature will be added in the future.
References
#mtfbwy