I'm developing an extension for Firefox which searches terms in a page. And I'd like to change found text highlight color and background. For example, I search for a letter "s" and by default it's selected with a blue rectangle with white text color. So I want to change the blue to the red.
How could I do this via JS?
Edit0:
To select a found text I use document.createRange() and selection.addRange() methods.
I don't know how the default finder selects a found term and applies background to it.
So maybe the 'range' method is not the best.
But I think I'm searching a way to highlight this created range...
Edit1:
Now I've partially resolved the color-changing preoblem. Just add a CSS rule with ::-moz-selection and red background when a text is found and selected. Then for document 'onmousedown' I remove this rule not to leave the default selection as red.
But a new problem is when I find say a digit and it gets a selection the background of that selection is gray (so it looks like a text selection of an inactive window). Then when I click with my mouse somewhere in the document text and press F3 the extension finds the next digit and selects it with the red background. And next findings work right (with red background).
So my purpose is change that initial gray background to red.
Maybe I should change the inactive selection color...
Edit2:
Now I updated my JS code:
var selection=w.getSelection()
var range=w.document.createRange()
range.setStart(foundNode,foundOffset)
range.setEnd(foundNode,foundOffset+foundLength)
selection.removeAllRanges()
selection.addRange(range)
var controller=gBrowser.docShell.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsISelectionDisplay)
.QueryInterface(Ci.nsISelectionController);
controller.setDisplaySelection(controller.SELECTION_ATTENTION)
controller.repaintSelection(controller.SELECTION_NORMAL)
Thanks to Noitidart's answer I found some information on how to use nsISelectionController XPCOM interface to select found text with background. Still I can't set a custom color for this background so that it be different from the default color of found text in Firefox. But setting the ui.textSelectBackgroundAttention preference in about:config to desired color will work with both my extension and default find engine.
I've found that SELECTION_ATTENTION constant is responsible for that background color and the setDisplaySelection method links the color to the selected text. But I couldn't find any implementation of this method. I saw only nsISelectionController idl file with its structure but no correspondent .cpp or .js file implementing this .idl. So I don't have information on how the color is set.
Edit3:
Recently I added the "Highlight All" functionality to my extension. And a new question about color of this highlight has rised. Using the above tecnique will show all the matches with green find color (by default). But it's more comfortable to use a different color to distinguish the current match and others.
So I couldn't find another helpful nsISelectionController constant for the "Highlight All" selection. I simply set this selection to 'DISABLED' type and changed the ui.textSelectBackgroundDisabled about:config pref. This pref is obviously for the selected text background of an inactive window. And it worked for me.
controller.setDisplaySelection(controller.SELECTION_DISABLED)
Another thing is that I'm not sure that the controller.repaintSelection() in the previous Edit is necessary. I guess the selection didn't work without it when I started my experiments with this stuff. But now I removed that line and all still work.
Plus:
And some additional links if somebody will need:
nsISelectionController Reference
Selection Reference
Forum question about highlight
about:config prefs for highlight
An Add-on using a similar tecnique
Finder.jsm and other sources
Also I used some files from Firefox source archive: Firefox 33 Source:
- nsISelectionController.idl [\content\base\public\]
- nsTypeAheadFind.cpp [\toolkit\components\typeaheadfind\]
- Finder.jsm [\toolkit\modules\]
- findbar.xml [\toolkit\content\widgets\]
I asked this question to quicksilver via email and this is what he told me:
You might find this one helpful: https://developer.mozilla.org/en-US/docs/XPCOM_Interface_Reference/nsISelectionController
I'm hardly the master you think I am, actually. :) To change those colors I just change the values for preferences:
ui.textHighlightBackground
ui.textHighlightForeground
ui.textSelectBackgroundAttention -> SELECTION_ATTENTION, it's not a highlight, it's a normal selection (as you would select some text with your mouse and it would turn the regular blue blackground, in windows at least) but it's given "attention", so it has the green background that the find operation reports. Basically it's a way of showing the user "Here I am!!" after firefox automatically selecs the text he searched for.
And I really don't know most of those contants, SELECTION_NORMAL is for normal text selection, like it would be when you select text with your mouse, SELECTION_FIND is for the highlights, and I only know the ON/HIDDEN/OFF/DISABLED ones which are self-explanatory. SELECTION_SPELLCHECK is probably for the auto-correct when you are typing in an editable content node, but I'm just guessing that one from the name.
Also, as far as I know, it's not possible to just create custom selection ranges/contants, as the code simply won't recognize them without editing the C++ code as well. Which is actually one of the reasons I haven't implemented https://github.com/Quicksaver/FindBar-Tweak/issues/76 yet.
Related
I am trying to set a background color for a List that will adapt to the iOS mode (light/dark).
I use .systemGray5 without problems in VStacks but when using it in Lists and I change to dark mode I get a very dark, almost black color which makes everything unintelligible.
This happens regardless if the list is dynamic or static. Is this a bug? Or is there an alternative way to do it?
List {
Text("Privacy").foregroundColor(Color(.systemRed))
}.colorMultiply(Color(.systemGray5))
The problem is that colorMultiply will multiply all colors in the list (text, background, separator) with the given color (see multiply color blending). This will darken the whole view, which probably looks okayish in light mode, but is the opposite of what you want to do in dark mode.
There are two ways to change the background colors in a List:
List {
Text("Privacy").foregroundColor(Color(.systemRed))
.listRowBackground(Color(.systemGray5))
}
.background(Color(.systemGray5))
background will change the background of the whole List, but I guess this is only really visible in grouped lists, since the cells usually don't have any space between them.
listRowBackground changes the background color of a view when it's used in a List environment. That's probably what you want to use here.
Frank Schlegel provided an answer which works only for static lists. Until Apple fixes this for dynamic lists I solved my problem by using this code
List {
ForEach(pumpData) { pump in
Text("pump").listRowBackground(Color(.systemGray5))
}
}.background(Color(.systemGray5))
.secondarySystemGroupedBackground worked for me.
I am using VS 2019 with a black background editor. The List, Seq etc. methods are black and I cannot see them. Please see the attached image. What is the setting that controls the color of these methods? There is a setting 'Symbol-Static' (under Options -> Fonts and Colors -> Show Settings for: Text Editor) but Item foreground and background are disabled. The extension of the file is fsx.
Thanks
You can set the color under Text Editor | Fonts and Colors: F# Functions / Methods. By the way, the module can also be set under User Types: Modules. So for example:
Is set to purple in:
Looks like a default from a light theme is being picked up.
Here such identifiers are using the Plain Text colour (but then, here, so is the the function name and its parameter identifier).
Do you have any extensions that may be adding extra syntax colouring?
Additional
As noted by s952163 the color setting "F# Functions / Methods" is more specific. But it also sets the method names that are shown differently in your screenshot.
Resharper adds lots of extra settings, one of these could easily be changing static methods (maybe across languages), but I do not use Resharper in part because it was too much effort to change all the defaults I disagreed with!
is it possible to change color of bottom horizontal line of iPhone X series within app(inside app only)? my client is asking to change color of this line, and i am not able to find any related topic or solution.
Thanks.
No, I don't think it is. That's drawn by the system, and is not part of your app. Apple does not let apps change things outside of that app's "sandbox".
Edit:
I found a long article on the subject online:
https://medium.freecodecamp.org/reverse-engineering-the-iphone-x-home-indicator-color-a4c112f84d34
It seems it's called the "home indicator" and this author supports my suspicion that you can't change its color.
Edit #2
As Matt points out, the color of the home indicator changes automatically. The system has logic in it that tries to keep enough contrast between the home indicator and the area around it so that it's clearly visible. See the article I linked for more on that subject than you probably wanted to know.
You can only remove it:
override var prefersHomeIndicatorAutoHidden: Bool {
return true
}
The color is applied automatically.
I've got two UITextViews containing data that should be recongised by the data detection, however whilst one works fine on both device and simulator there's one that only works under Simulator. I've attempted trashing the build from my device, cleaning the product down, removing derived data and nothing seems to resolve the inconsistency.
Link detection was enabled within Interface Builder, the data is passed in with a NSString stringWithFormat: formatted string and set with UITextView setText:. Set the same way for both, so there's no difference there, but it just doesn't seem to work correctly for one of them.
EDIT: On the device if I tap on one of the items that should detect as a link, it'll then turn blue and do link detection. I'm not setting any custom fonts or colours that could have an impact.
It appears that the trick is to setScrollable:NO. Seems to fix the problem, although if you need scrolling, I'm not sure what the answer will be...
Apparently this issue is caused by how iOS is currently handling the UITextView links. It is creating an NSAttributedString that turns sections of the text blue ( when the view contains a link ). So I've figured out that this bug only occurs when a link is the first text in the AttributedString, i.e. the first text in the text view. So it's easily fixed by prepending an whitespace to your text before setting it. Or overriding setText to " " + text;
Hope this helps guys
I have the following code snippet for creating an input field for entering colors:
DataSourceTextField colorField =
new DataSourceTextField(ZoneDto.ATTR_COLOR, "*localized name*", 7, true);
colorField.setEditorType(new ColorPickerItem());
colorField.setPrompt("*localized instructions*");
This works quite well, since the input field has the localized instructions in its tooltip, but the small square that opens the color picker window has the original english tooltip ("Click to select a new color").
How could I change this message to a localized one?
Is this even possible to accomplish? I read that setEditorType only sets a template, from which instances are generated whenever needed. This means it's not going to work if I add setPrompt("localized instructions") to the ColorPickerItem given to the setEditorType().
Thanks in advance!
If i get you right, why not fill a variable 'localizedStringForColorPicker' with the current selected localization upon startup. And change it, when another localization is selected?