Is it possible to change color of bottom horizontal line of iPhone X series within app? - ios

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.

Related

iOS Extension with transparent background

I would like to add transparency to iOS widget, but it looks like it is not supported by default.
Most widgets are non transparent, but I have an example of transparent one.
That's why I ask you about any tips on how to implement such feature for widgets.
Thanks in advance!
Short answer is you can't (as of iOS 14.5).
Most "pseudo-transparent" non-Apple widgets involve asking the user for the wallpaper they're using, then cropping it accordingly and using the result as a widget's background, creating an illusion of transparency at that exact widget position. This can (and will) break parallax and other such effects.
That is if we're talking WidgetKit, of course; legacy Today widgets may give you a bit more freedom, although you likely won't achieve full transparency without hacks like above.
Vym is right. We just developed a widget app that can implement such a pseudo-transparent effect.
Hoping this might help others who want to achieve such effect.
Here is how:
Guide the user to take a screenshot(with current wallpaper) on a blank home screen, and save it.
Tell the user to provide the widget with the widget position. This can be done via the Siri Intents Extension.
public enum WidgetCropPosition: Int {
case smallTopLeft
case smallTopRight
case smallCenterLeft
case smallCenterRight
case smallBottomLeft
case smallBottomRight
case mediumTop
case mediumCenter
case mediumBottom
case largeTop
case largeBottom
}
Crop the saved wallpaper according to the widget position.
The pain point here is the widget of the same position does don't have the same frame location on different devices. You have to do a lookup the table to find the correct position.
This is a Swift Package that helps to crop the correct frame on different iOS devices.Translucent

List with system background color gets messed up in dark mode

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.

WatchKit UIPageControl Dot Colour

When I was watching one of the videos from Apple about the Apple Watch and its features I noticed that the page indicator dot colours change depending on the page presented.
They've also got images of the coloured dots within the Apple Watch Human Interface Guidelines App Anatomy section. Note the coloured title text as well.
Normally in WatchKit I would use the following snippet of code to do this:
let features = ["First", "Second", "Third"]
let controllers = [String](count: features.count, repeatedValue: "FeatureInterfaceController")
self.presentControllerWithNames(controllers, contexts: features)
Unfortunately as far as I know there isn't a way to access the currentPageIndicatorTintColor and pageIndicatorTintColor as you normally would as part of UIKit here (scroll down to Tint Color).
I wonder if Apple simply just added those colours for the video or whether they're actually going to be available as part of WatchKit in the future?
Perhaps I'm wrong and there is a way to change these dot colours.
As written by an Apple Engineer in the Dev Forums, it's not possible to customize the color of the page control at this time.
Source: https://devforums.apple.com/message/1100695#1100695

Change found text highlight in a Firefox extension

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.

invert UIDatePicker colors in iOS 7

I want to start by saying that i would post this question on the Apple Dev Forums but because of the hacking attempt fiasco , or whatever that was, the forum has been offline for almost 2 weeks now and i need a solution for this as soon as possible.
In iOS 7 the UIDatePicker looks like this :
and a client asked to look like this :
(basically inverted).
I've tried a few things:
Setting the background to black and looping through all the view's subviews until i reach the labels that show the date itself and change their color to white. The problem is that The view has only one subview, and that subview doesn't have any subviews of it's own. So this solution doesn't work. (it did in ios6).
Applying a filter to the view's CALayer. The thing is that this is only possible on OS X not on iOS, for some unknown reason.
Playing with UIApperance protocol. From what i've read this should work but what i've tried didn't and i don't have extensive experience with this to figure out why not.
Any ideas what i can try? Is this even possible? Did i made a mistake in my approach of the problem?
Try this out :
Put this code in -(void)viewDidLoad
[datePicker setValue:[UIColor whiteColor] forKey:#"textColor"];
Swift:
datePicker.setValue(UIColor.white, forKey: "textColor")
Don't know if this is still relevant but on Swift 3 / Xcode 8 you can simply do this:
let datePicker = UIDatePicker()
datePicker.datePickerMode = UIDatePickerMode.date
// Sets the text color
datePicker.setValue(UIColor.white, forKey: "textColor")
// Sets the bg color
datePicker.backgroundColor = UIColor.black.withAlphaComponent(0.6)
textField.inputView = datePicker
I spent quite a bit of time struggling with the same problem. At first, I've put a UIDatePicker on a black background and was wondering why it is invisible...
I ended up placing a white UIView as a background for the date picker, so while the whole view is black, the date picker is white. It actually looks okay, although thankfully I don't have a client who would dictate the design.
One possible argument for a client: the old, pre-iOS7 date picker, also had a predefined non-customisable background.
What you want is possible, but it will be called Custom Date Picker.
Below is the link where you will find what you wanted.
https://www.cocoacontrols.com/controls/simpledatepicker
If you need more, take a loot at below link.
https://www.cocoacontrols.com/search?utf8=%E2%9C%93&q=datepicker
Well I understand your frustration, but iOS7 is under NDA. Usually this kind of views are made using layers, beacuse of sublayerTransform that can make perspective giving the idea of 3D. I would check sublayers if you don't see subviews.
The other poin is that I would not hack too much views/layers hierachy, ios<=6 to ios7 transition shown that hacking isn't a good idea.
UIAppereance protocol is probably the way to go, becauase it makes you change what you can change (without screwing that in the future), maybe you can set a backgroundImage, try to set a 1x1pixel of a blck color png, you should also see an attributed string property, or text property.
I dont think its possible to do that directly by changing the properties of the default UIDatePicker , although you can use custom controls to do it.
This might help,
MWDatePicker - https://github.com/mwermuth/MWDatePicker (Found it in cocoa controls -https://www.cocoacontrols.com/controls/mwdatepicker)
according to the iOS Design Resources:
You cannot customize the appearance of date pickers.
I would suggest one of the below:
Redesign your UI to use the black text
Use a customer datepicker
You should tell your client that his suggestion is against the design principles of iOS 7, which indeed it is. I am not a great fan of iOS 7 myself, but we should all give it a go. Your client should accept the standard iOS 7 UI provisionally, until he is in a position to make an informed judgement. Designing an app based on his initial impressions is a recipe for disaster.

Resources