What does text inside a red rectangle in VS Code mean?
If I just start typing outside of any file and outside anything (e.g. the Ctrl+P input, or the search input), then I am getting what I typed being added inside a red rectangle. Here is a screenshot of what I mean:
The rectangle appeared in the right upper corner of my opened VS Code when I typed Foo.js. By rectangle I mean the filled one, the red border was added by me manually to highlight the filled rectangle.
I am very curious what is a purpose of this?
The text you get in red rectangle is the search that VScode performs on the version control changes for filename. You can type more to search specific files in you changes list.
You can click on that box to enable or disable filter based on what you typed
This is the document tree filtering feature that appears to have been released in version 1.31, see the Workbench section of the release notes more details.
The current "Getting Started" docs states:
You can type to filter the currently visible files in the File
Explorer. With the focus on the File Explorer start to type part of
the file name you want to match. You will see a filter box in the
top-right of the File Explorer showing what you have typed so far and
matching file names will be highlighted. When you press the cursor
keys to move up and down the file list, it will jump between matching
files or folders.
Hovering over the filter box and selecting Enable Filter on Type will
show only matching files/folders. Use the 'X' Clear button to clear
the filter.
Related
Here are a few images showing what I'm referring to. They come in different colours, for example red blue and green below:
Red line markings
Blue line markings zoomed in
Green line markings zoomed in
Line markings
I couldn't find any answer while browsing. It might be because I am unable to search in a right manner.
These are "diff decorations". They indicate what has changed about a file.
Red means an existing line has been deleted/removed, green means a new line has been added, and blue means an existing line has been modified.
These are all comparing against a previous point in time, which is usually a "commit" in your Source Control Management / Version Control Software of choice (Ex. git, subversion, VS Code's Local History feature, etc.)
Their display is controlled by the scm.diffDecorations setting (SCM stands for "Source Control Management").
If you don't specify a scm.diffDecorations setting value, then the default value is "all", which means to display it in the gutter (the sidebar between the line numbers and the text being edited), the minimap, and the "overview" (decorations inside the scrollbar). You can also use the values "gutter", "minimap", and "overview" to only display decorations in one of them, or "none" to not display them at all.
As you already show in your screenshots, clicking on the decorations in the gutter opens an inline popup showing what has changed and offering action buttons to revert the change.
You may also be interested in the following related settings: scm.diffDecorationsGutterAction, scm.diffDecorationsGutterPattern, scm.diffDecorationsGutterVisibility, scm.diffDecorationsGutterWidth, scm.diffDecorationsIgnoreTrimWhitespace, and git.decorations.enabled.
I'm currently developing a vscode extension that highlights snippets of text in specific colors. In order to do that I am creating a TextEditorDecorationType with the color and use setDecoration (TextEditor) on the active text editor.
Now I would like to compare two different colors on the same snippet with each other. Therefore I want to have the editor split in half showing the text document twice, on the left side with the old decoration and on the right side with the new decoration, similar to the git source control:
I figured if it is possible in the source control it should be possible anywhere.
Currently I open a second text editor with the same TextDocument and add the new TextEditorDecorationType to it, yet instead I would like to do it as shown above.
I cannot figure out how to split the editor like that displaying the same content twice.
When I compare two versions of a source file (for example, from egit) in the Eclipse IDE, the Compare View is appeared. It has two panes containing two versions of a text and I can use keyboard to move cursor through the text on one of this panes (or even edit the text in it). Additionally, I can use special shortcuts to go to the next/previous difference and/or apply current change from/to the opposite pane. But, I didn't find a way to move the input focus to other pane.
Actually, I would like be able to do this in one case. Let's say, I compare two revisions of a source and I need to apply some changes while others are unneeded. To achieve this, I walk through changes using the Ctrl + , or . shortcuts and apply needed changes using, for example, the Ctrl + Shift + ,. It looks like all is OK, but if I reach a change which has no any text in the current pane, the applying shortcut does not work. For example, the cursor is on the left pane. I went to the next difference and this difference is concluded in that the text was, for example, added in this line. So, the Compare View will show this added text on the right pane, will highlight it with the special rectangle while this rectangle on the left pane will have zero height and the cursor will be placed under this zero-sized rectangle. I.e., outside of it. So, I think, exactly this thing causes that the current change applying does not work. When I click on the opposite pane, inside of this change and then use the change applying shortcut, it works fine. So, I would like to switch to other plane via shortcut, not using mouse.
For example, get a php function named "example". How do I find out what other files I use this function for? I just want to search the files in the workspace.
Click the magnifying glass on the left side, put in the term, and press Enter / Return.
(Hit the little 3 dots to include/exclude files.)
Click the arrow to the left of the search box, and then you can do Search and Replace in files.
You can also find the functions specifically, as outlined here:
https://code.visualstudio.com/api/language-extensions/programmatic-language-features#find-all-references-to-a-symbol
I'm able to highlight text but I'd like to use custom highlight colors. Even if I define custom colors, Word seems to use one of the colors in the default palette that it thinks is closest.
myRange.font.highlightColor = "#ffcc00"; // Should be orange. Comes out red
That color should come out orange but it comes out red.
Any ideas?
Word does not support custom highlight colors - only the traditionl, basic sixteen colors. This is a limitation of the Word application, not the Office JS APIs.
It would be possible to apply custom colors using Shading, however (as in borders and shading).
Here's a work-around to the problem of defining custom highlight colors which I discovered quite some time ago ..
If you paste in highlighted text copied from an application from outside of Word (i.e., highlighted text from an AOL email let's say), you can then:
Use the insertion bar to select and highlight an area of the text you just pasted in
Press the FORMAT PAINTER tool to copy the formatting of the area you've selected. The pointer changes to a PAINTBRUSH icon (with an insertion bar attached)
Move the PAINTBRUSH to the existing Word text that you want to highlight using the new color
Press and hold the mouse button (usually the left button) while selecting the specific text
Release the mouse button to apply the new highlighting and formatting
The applied highlighting will also include any other existing formatting; so you MAY have to change the font or adjust some other feature (i.e., turn on/off bold, italics, underline, etc.) But this is easily accomplished. The point is that you can now have ANY color highlighting that you prefer – this hack absolutely DOES work!
Here's, one last thing – when you save the document (by clicking the OFFICE BUTTON in the upper left corner), I would advise that you first select WORD OPTIONS, then SAVE and check the box next to "Embed fonts in the file" under "Preserve fidelity when sharing this document" (I always uncheck the other two boxes). This is to ensure that before you export or print the document, you may be sure that all the fonts and features have been saved within it.
And for the record, this technique is NOT shading.
The highlighting comes from actual HIGHLIGHTED TEXT copied from a document or application from OUTSIDE of Word. So it has nothing whatsoever to do with Word's shading feature. I've even copied highlighted text from non-dedicated word processing applications, and then pasted the text into Word – where it is then available to apply the copied highlighting to text within the existing Word document.
If you think about it – the fact that Word 2007 permits you to define any THEME color you want clearly shows that one should be able to define ANY desired custom HIGHLIGHTING color as well – besides just the 15 basic colors (and excluding the "no color"). And this work-around proves that this is so. The problem is that the Word application itself does not permit you to accomplish this directly.