Page down/up when clicking in the VSCode scrollbar - visual-studio-code

Is there a setting to change the click behavior in the scrollbar to page up/down instead of jumping to the location in the file? This is the usual scrollbar behavior in almost every other applications except maybe unix applications.
A suggestion could be:
Left click: page up/down
Right click: jump to location

There is a setting for this now:
Editor: Scroll by Page
Controls whether clicks scrolls by page or
jumps to click position.
With that setting enabled, the editor will scroll by one viewport page when clicking anywhere above or below the scrollThumb. With it not enabled (the default) it will scroll to the position in the scroll track where you clicked.

This behavior does not currently exist. I suggest opening a feature request on github.

If, like me, you've been brought to this page despite putting "Visual Studio" into your web search, you can modify this behaviour in the full blown Visual Studio as follows:
Tools > Options > Text Editor > All Languages > Scroll Bars
Under "Behavior", toggle between bar mode and map mode
More information can be found by reading the Microsoft Docs for this feature.

Related

How to detach Outline from Explorer

Problem: Detaching the Outline section from Explorer and moving it to the right side.
Tried: right-clicking, changing the settings - cannot find where and how the Outline section be detached from Explorer.
Question: is it possible to detach the Outline Panel from Explorer Panel?
Is there another extension, which the same functionality as Outline, which could be placed on the right side?
Thank you!
This should be supported directly in VSCode 1.64 (Jan. 2022), with the new side panel.
New Side Panel
This milestone, we introduce the Side Panel, a new surface in the workbench to house views from the Side Bar or the bottom Panel appearing opposite the Side Bar.
Unlike the historical ability to move the bottom Panel to the left or the right of the editor, the new Side Panel works in addition to the bottom Panel so you can see more sets of views at once.
To use the Side Panel, you'll need to move some views over to it.
Based on one of our most upvoted feature requests, you might want to move Outline from the Side Bar to Side Panel.
You can do this by dragging and dropping the view into the Side Panel.
If the Side Panel is not open, just like the bottom Panel, dragging a view to the edge of the editor area, will pop it open.
Alternatively, you can use the Move View command for something more keyboard friendly.
Moving Outline View to the Side Panel:
Yes you can, click on the Outline Title Bar and you can move it to any other panel, even the bottom Problems/Terminal panel.
You don't need any special extension for it. Almost all panels can be moved around in VSCode
You cannot have a Floating Window however.
You also Cannot have Two Sidebars
If you want to have the sidebar to the right go to View - Appearance - Move Side Bar Right
As of now, no you cannot have two sidebars, this is the issue tracking that feature.
I can suggest an alternative, you can move the outline to the bottom panel, where the terminal is so that you can have both at the same time but just not as a sidebar.
like this:
or like this but attaching two Bottom Panel tabs together.
Here is a Demo on how to do it
So after a lot of searching, I finally came up with my own solution. Apologies in advance for the poor screenshot quality. I used Microsoft's Steps Recording not realizing the image compression would be so poor.
First, open up a new terminal (Ctrl+Shift+`)
Make sure that the terminal tab is active in the panel. Right click the terminal name on the right-hand side and select "Move into editor area.
"
You can then right-click the now-tabbed Terminal in your editor space and select "Split down."
Your editor should look like the image below. However, we're not done yet! Here's where the magic happens. Open another terminal.
Things will look weird but this is going to work.
Click the "Outline" header in the sidebar and drag it into the bottom terminal panel:
Sidebar > (Outline) > Terminal Panel
Next, right-click on the tab bar of the bottom panel and select "Move Panel Right"
Et voila! You should how have a sidebar on the left, and Outline on the right, and a Terminal on the bottom!

How to move Output or Terminal back into the panel in the window layout?

Recently in VS Code, somewhere around v1.42 or v1.43, we gained the ability to move around the following windows/panels that used to be stuck in the panel:
Terminal
Output
Debug Console
Problems
They could be split into multiple items in the panel itself (side-by-side or top/bottom, depending on whether the panel was at the bottom or left/right), and even dragged into the side-bar.
This was great, but after moving all of these windows to the side-bar while experimenting, I can't find any way to move them back into the panel. The panel is now empty, except for 3 dots (an ellipsis) in the upper left corner. You can still hide/show the panel, and move it left, bottom, or right, but there is nothing in it, and you can't drag anything to it. Dragging the terminal into the panel shows an icon that looks like it will successfully move (it's not the icon with the circle/cross-out you get other places it won't drop), but when releasing the click-drag, nothing happens.
I had just upgraded to v1.45.0 when this happened. It appears to be a defect, unless I'm missing something. Does anyone have a way to put the terminal or one of these other windows back in the panel, or reset their position? I combed the settings, and tried to find default setting's files (system or user) that might hold info on what is in the panel vs. the sidebar, etc., but couldn't find anything via search or on my PC. Any ideas?
Note: This is NOT about moving the panel between the left/right/bottom positions, or selecting the terminal/output/etc. in the panel itself. That's "old news", this is a recent feature.
Here is a view with the Terminal, Output, Debug Console, and Problems put at the top of the sidebar toolbar, and Terminal focused. The Panel is just to the right of the sidebar window, set to the "left" position, completely blank and useless. The "welcome" window on the far right side:
And here are my current settings:
See this issue https://github.com/microsoft/vscode/issues/96117 (Empty panel behaves weird)
Suggested fix:
Run the command View: Reset View Locations in the command palette.
Please see: https://www.technipages.com/visual-studio-reset-window-layout
Menu Window / Reset Window Layout worked for me in VS 2019

VS Code - toggle search icon in Activity Bar, move from panel or back

I accidentally removed search icon in Activity Bar and don't know how to add it there again. If I click on Activity Bar, I don't see this option any more.
Update: v1.44 you can now simply drag many of the views, including "Search" from the sidebar to the panel and back. See https://code.visualstudio.com/updates/v1_44#_increased-view-placement-flexibility and https://stackoverflow.com/a/55981465/836330
Update: v1.42 added a context menu option
Move to Panel/Move to Sidebar
to certain typically sidebar views like Search, Outline and custom views. So you wouldn't have to use a setting to move the Search view back to the sidebar. Here is a demo:
Also notice that you no longer right-click in the empty space below the search inputs in the sidebar but on/near the Search header itself to bring up the toggle option.
As part of the v1.42 release the search.location setting mentioned below will be deprecated.
Your setting should migrate automatically, but you will need to use
the new generalized method to move the Search view going forward. You
do not need to enable the experimental preview setting above in order
to move the Search view with the new context menu entry.
So I don't think there is a setting anymore, you just right-click on the header text "Search" whether it is in the Panel or active in the Sidebar to move it. See the demo below.
Right-click on the "Search" header if you have it in the sidebar to "Move to Panel".
If Search is in the panel, right-click on the word Search to "Move to Sidebar".
To enable moving the Output view at this point, you need to enable workbench.view.experimental.allowMovingToNewContainer.
There is a new unbound command workbench.view.search.moveView which you can use to toggle the search position between the panel and sidebar. But note that in my testing it only works a couple of times because it focuses the panel when you move search to the sidebar - I'll file a bug.
Previous Answer::
You may have modified the setting:
"search.location": "sidebar",
which is the default to the alternative
"search.location": "panel",
which would put the search widget into the terminal panel as another tab.
As of vscode v1.35 or so, you can now right-click in the empty space below the search view (i.e., in the sidebar under the open search inputs) and you will get an option to Toggle Search View Position.
This context menu switch of the search view is persistent. It will automatically add this setting to your settings.json:
"search.location": "panel",
The only way at present (but see edit just below) to move the icon back to the activity bar (and thus the search across files functionality to the sidebar) is to change that setting to the sidebar option. Or look for this setting in the settings editor:
Search: Location
Controls whether the search will be shown as a view
in the sidebar or as a panel in the panel area for more horizontal
space.
EDIT: More recently, vscode added the abilty to right-click in the search area when it is in the panel to toggle it back to the sidebar.
In windows
file--> preferences-->settings
In mac
preferences -> settings
vs-code version 1.30.2
Step 1: Click on Edit from Navbar
Step 2: Find in Files
.
.
You can easily search for anything in the side paanel
or else if you want anything to search inside files then
Step 1: Click "Ctrl+F"

Eclipse Outline view is hiding code

I'm using the Kepler CDT release (4.3.1) of Eclipse. When I click on anything in the Outline view, the corresponding editor view is reduced to showing just that item. If I click on a variable, I get a single line with just that variable. The Edit->Expand Selection options are all dimmed out. Hitting Shift-Alt-Up Arrow just moves me up to the previous item in the outline view. If I change editor tabs and come back then the Expand Selection options enable and I can manually hit Shift-Alt-Up Arrow a number of times to make the entire file visible again but clicking on anything in the outline view again will just reduce the view. Is there some new setting in Kepler that will make outline stop doing this?
Turns out the feature for Show Source of Selected Element Only was turned on. In Kepler the toolbar button for this is not visible. Even searching under quick access doesn't turn it up so it's somewhat of a puzzle how it could have been turned on. I actually thought maybe it had been removed from Kepler.
In the Customize Perspective dialog under the Tool Bar Visibility tab. In the Tool Bar Structure section I opened the area for Editor Presentation. I noticed there was actually a check next to the box for Show Source of Selected Element Only. However, it wasn't visible in the toolbar (a bug I've seen before in Eclipse) so I unchecked it and checked it. Then I exited the dialog. Now the button showed up on the toolbar. I then toggled the feature on and then off. Now clicking in the outline view works correctly.just moves to the correct spot.

How do I use Chrome Web Developer to examine tipsy hover overs?

I am trying to inspect the div element that appears for Tipsy hover-overs on this page in order to change the width of the popup.
https://dl.dropbox.com/u/1531353/Misc/Docudocker/setups/tipsyCrashingApplication/force-html.html
However, when I press Shift+Ctrl+C, and then move my mouse to the Developer Elements panel, the Tipsy hover-over disappears, so I can't examine it any more.
How do I examine an element that only appears upon a hover-over effect in Chrome Web Developer?
I am using Win 7. I used firebug & it showed that tooltips were using the tipsy.css try to navigate to your tipsy css & change the width attrib though i couldnt get the bottom part of the tooltip in right shape. Hope it helps