Visual Studio Solution Explorer like experience for VSCode - visual-studio-code

Sorry in advance if this is not the right place to ask but can someone help me customise VS Code to work similar to Visual Studios Solution Explorer?
In Visual Studio we have the Solution Explorer which lists all files but also there are 2 very handy view filters; found in the title bar of the Solution Explorer panel.
Open Files Filter
Pending Changes Filter
if neither is selected then default to show all files in the solution
Ideally I want the Workspace view that lists all files in VSCode, but also a toggle to only list 'Open' files. (I'm less interested in Pending Changes).
I'm aware of the Open Editors view but I find this difficult to navigate since it's a flat view and isn't a nested directory structure. When every file is called view.html in its own folder it's a nightmare to eyeball the list of files.
Also I think toggling between "all" and "open" files would be easier than going up and down between 2 panels when you want to open something new.
So is this possible, does anyone know of a way to customise vscode to get this behaviour?
Thanks in advance!

Related

Visual Studio Code - Tabs (editors) of the same project in multiple screens

Using multiple screens I normally place multiple classes (files) in different screens, this helps me a lot while refactoring, checking tests and comparing changes.
Visual Studio Code does not allow me to drag a tab outside the window and view it in (for example) another monitor.
I checked the documentation and plugins, but the only way I found, is to open two windows, pointing to the same project (folder) and put those in different screens.
I don't like this solution, that causes also some problem when I watch code changes using TypeScript.
Any suggestion?
I use Windows 10, latest version of VSCode.
A solution is to press CTRL+K and after releasing CTRL, press O.
This will open the current file in a new window.
There are few things I don't like about this solution:
- Drag and Drop does not work
- Create a new instance of VS Code resulting in (for me) 180MB of ram used
- To open the file it takes to me few seconds (quite slow)
- The file remains open in the original window as well
Update 20/03/2019:
There is a feature request you can track here:
https://github.com/Microsoft/vscode/issues/10121
And an explanation about why this is difficult to implement here:
https://github.com/Microsoft/vscode/issues/10121#issuecomment-345770248
Update 20/03/2019:
Another important side effect highlighted by #Mär is that:
the IntelliSense fails to establish references it had when the file
was opened in the window, where the entire project is opened
The easy way but with the same drawbacks. More ram and resources will be used. Is to wrap your project in a folder.
It's the best possible thing. As by now!
=> Duplicate the workspace.
Open the command pannel ctrl+shift+p or F1.
Then write dupl
You'll get that
That's it.
More
If you want to add more folder to the working space.
=> go to File then Add Folder To Workspace
You can add as many as you like.
 Also better more
You can open a new window (ex: ctrl+n)
And then go File > Add Folder To Workspace.
And start adding folders to your new Workspace. You can add any folder, that is already open or not. That's too way great. You can have all the needed folders for example in the second screen.
A little hack I used is to just stretch the editor window to fill both screens and split the view pane between the monitors such that both screens show just one open file.
This is a cheap hack that works without opening multiple instances of VSC.
It may not be the proper solution, but it works without eating up all my system memory.
I found the following way to work on multiple monitors (important: they must be the same size and resolution):
open a visual studio in windowed mode on the 1st monitor (in my case it is a left monitor)
move the window to the (left) top corner
stretch window to the 2nd monitor (right) bottom corner
split screen by clicking “split editor” several times
move the code sections separator to the edge between the monitors
This is old qestion, but such way can be useful for someone. It is not very convenient, but it works. The solution may have already appeared in the VS itself, but I didn't find it.
Visual Studio Code does not allow me to drag a tab outside the window and view it in (for example) another monitor
Actually, VSCode 1.57 (May 2021, 4 years later) will propose something close:
Improved editor drag and drop across windows
Support for dragging editors to other windows was improved in this release. You can now drag diff editors, custom editors and the entire editor group to another window to open the editors there.
My solution was to use Remote-ssh to connect to self and open in another window. This does take extra resources. But I find this comfortable as I don't need to create additional workspace.
For me on Ubuntu the solution was to create a project folder symlink and ope it in a new window (as it won't open the same folder in another window)

Cannot see folders sub folders and files in Vs

I just started using Visual Studio Code Version 1.15.1 and for some reason, after closing all the folders in the navigation explorer side bar, I cannot get it back to display the folder structure and files in the project, even after closing and reopening. The files and folders are available and I can see them fine in OSX Sierra. Also the VS code window title shows the name of the project.
You can get it back by right clicking on the sidebar "Explorer" header, and selecting "Folders". See the gif here: https://github.com/Microsoft/vscode/issues/32962#issuecomment-324866098
This has confused several people so we've decided to remove the ability to hide the "Folders" view. Continuing discussion on the general UI is here: https://github.com/Microsoft/vscode/issues/31485

Visual Studio Code explorer view scrolling

My project contains a LOT of folders, many of which I routinely have open, making for a lengthy explorer view. I find scrolling this view quite frustrating for two reasons:
There is no equivalent of the editor.mouseWheelScrollSensitivity setting for the explorer view. I'm also generally happy with the scroll speed for my mouse in other applications, so don't want to go messing with a system wide setting to compensate for VSC.
The scrollbar is frustratingly difficult to grab at and requires precise mouse placement. The number of times I accidentally grab at the slider and resize the view rather than scroll it is ridiculous.
I've found no useful extension to help in this matter. Has anybody any suggestions? I'll raise an enhancement request in Github if necessary.
Here are 2 shortcuts that can speed up navigation between files:
With Ctrl then Tab you can browse a history of your last viewed files. Great for switching around when working on multiple files.
With Ctrl+P (Go to File... command) you can quickly go to a file by name. You can also search for files inside folders like this: folder/subfolder/file.ext. This is great if you know what you are looking for.
Source and more navigation tips: https://code.visualstudio.com/docs/editor/editingevolved#_quick-file-navigation
This PR in vscode 1.59 may have fixed this issue: https://github.com/microsoft/vscode/pull/110059/commits/61efc577e038ac772f12511fb823de27296dbc69
New settings:
workbench.list.mouseWheelScrollSensitivity
workbench.list.fastScrollSensitivity

Can I do this with a custom Visual Studio Code Extension?

I would like to have an additional feature in Visual Studio Code - essentially the "Scope to This" from the full Visual Studio Solution Explorer.
It is basically a context menu (right click) entry in the File Explorer of Visual Studio Code - which then should limit which files and folders are displayed.
Is such a thing possible with a Visual Studio Code Extension?
I never built an extension for VS Code before and would like to know if this is even possible or if I would just waste my time.
According to the API docs, there is no way to filter visible files in the Explorer like it can usually be done with the files.exclude setting. However, it is possible to open another folder with the workspace.openFolder complex command. This will probably also close all opened editors, and forget about the original workspace root path.
Your extension would need to remember the initial root path and opened editors to undo this "Scope to This" menu, and reopening everything every time could cause quite some lag.
You can't customize the normal explorer view.
However, you can do something like this with custom views. It allows you to create a new explorer view that can list what you want and behave as you want.
For an example implementation, check the vscode-code-outline.
If you can add a context menu entry separately too.

How to add views to Show In menu for particular file types

I use an older plugin called Veloeclipse for editing Velocity templates in Eclipse. There's been no development on this since 2009, which isn't a problem because it's mainly just for syntax highlighting and format validation. The really annoying thing about it, however, is that when I try to do Show In to view the current Velocity template within my Package Explorer or Project Explorer, the only available option is Properties. That's not really useful. I really need to be able to get to the file in one of the regular explorer views.
So I have sort of two questions:
Is there a way to configure this without having to monkey with any code? A configuration file or something? I've grepped through my Eclipse installation and haven't seen anything, but I'm hoping that there's something I'm missing.
So assuming that the answer to my first question is no, how do I go about modifying the plugin code so that it will show more than the Properties view in the Show In menu? Most of what I found on the plugin development wiki comes from the other direction: how to make your view or perspective appear in the Show In menu.
Any help with this would be hugely appreciated!
Try to check the plugin source code. it might do something different than other editors. What I mean is that the show in menu item that you have there is not the usual extension point but a hard coded context menu option.