How do I get the grey color/translucency I see on UIPickerDate default view on my own custom Picker? - ios

I have created a UI Picker but the default is just it being transparent. I would like to use/be given the RGB + translucency values that makes the grey color that is commonly used on picker views.
It is the same grey like the defualt color for a programmatic UI Date Picker. Thank you! I need this to be in alignment with Apple's Human Interface Guidelines.
Added a picture of the background color/translucency I need below:

iPhone SDK has two types of gray color both have opacity 1.
iOS 13 also introduces a range of six opaque gray colors you can use in rare cases where translucency doesn't work well.
https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/
And for changing the background color.
light gray color:
picker.backgroundColor = UIColor.lightGray
dark gray color:
picker.backgroundColor = UIColor.darkGray
if you want some transparency on the picker view. You can add Gradient on it.
let view = UIView(frame: CGRect(x: 0, y: 0, width: picker.frame.width, height: picker.frame.height))
let gradient = CAGradientLayer()
gradient.frame = view.bounds
gradient.colors = [UIColor.white.cgColor, UIColor.lightGray.cgColor]
picker.layer.insertSublayer(gradient, at: 0)
find the image as it looks with gradient and light gray color.
picker view with gradient

Hex color - #e8e9ed
RGB color - UIColor(red: 232/255, green: 233/255, blue: 237/255, alpha: 1)
or you can use #f7f7f7
I hope it works.

Related

UIImageView tintColor wrong on device

I have a UIImage and a UILabel next to one another, and set the label textColor and the imageView tintColor UIColor.purple.
However, on the device, the purple on the image is darker, it looks fine in the simulator though. I checked in the view hierarchy debug, and indeed the label has 0.5, 0, 0.5 as textColor, but the imageView has 0.4, 0, 0.4 as tintColor for some reason.
I tried setting 0.6, 0, 0.6 on the imageView, and it resulted in the tintColor being 0.48, 0, 0.48.
Any idea why that is ? I don't want the SDK to adjust my colour in any way, I just need the tintColor to be what I set it to be.
The code is quite simple here:
titleLabel.textColor = .purple
imageView.tintColor = .purple
I also noticed that setting the tintColor to .purple on the UILabel also results in it having 0.4, 0, 0.4 as tintColor rather than 0.5, 0, 0.5 as with textColor. For some reason the tintColor property edits the color it's given.

How to apply a color gradient to the background of a UILabel? [duplicate]

This question already has answers here:
How to Apply Gradient to background view of iOS Swift App
(30 answers)
Closed 4 years ago.
For example, the left side of the label is gray and the right side is blue. I want the color to be gray on the left side, but become darker as it goes right until the right side of the label is completely blue. Is there a way to do this without looking for an image online and setting the background color of the label to be the image?
You can add UILabel into the UIView and add Gradient Layer to that UIView.
For add Gradient Layer you can use following code.
let view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 50))
let gradient = CAGradientLayer()
gradient.frame = view.bounds
gradient.colors = [UIColor.white.cgColor, UIColor.black.cgColor]
view.layer.insertSublayer(gradient, at: 0)
You can also refer this question

Custom Color with cgColor

It might be the stupidest question you saw all day but i couldn't find a solution. i have a rounded image view with borders and i want the borders to be the the same blue as the default tint color in Xcode so if you could help that would be great . and sorry for the noonish question ;)
Now i have this:
self.imageView.layer.borderColor = UIColor.gray.cgColor
and i need to change
UIColor.gray.cgColor
to be the same blue as the default tint color without causing a crash or an error ... how can it be done?
thanks for your help.
just create the new color with blue color properties and apply to imageView
let color = UIColor(colorLiteralRed: 0, green: 122/255, blue: 1, alpha: 1.0)
self.imageView.layer.borderColor = color.cgColor
alertnatively you can use tintColor property of imageView like
imageView.layer.borderColor = imageView.tintColor.cgColor
Just drag and drop whatever color you want such as:

Fix UIVisualEffectView extra light blur being gray on white background

Apple provides this live blurring view class UIVisualEffectView and you use it with a UIBlurEffect which takes one of three available UIBlurEffectStyles:
enum UIBlurEffectStyle : Int {
case ExtraLight
case Light
case Dark
}
Now for demo purposes I set up two effect views with the styles Light and ExtraLight:
let lightBlur = UIBlurEffect(style: UIBlurEffectStyle.Light)
let extraLightBlur = UIBlurEffect(style: UIBlurEffectStyle.ExtraLight)
let lightView = UIVisualEffectView(effect: lightBlur)
lightView.frame = CGRectMake(10, 30, 150, 150)
self.view.addSubview(lightView)
let extraLightView = UIVisualEffectView(effect: extraLightBlur)
extraLightView.frame = CGRectMake(160, 30, 150, 150)
self.view.addSubview(extraLightView)
So far so good, everything works as expected, they blur images:
and kind of work on colors, too:
but when it comes to a white background this happens:
The Light effect on the left works as expected, but the ExtraLight effect on the right leaves some kind of gray square behind.
Now the question: Is there any kind of trick or method that would enable me to use an extra light blur effect on white background (with live blurring support) AND remove that ugly gray shadow?
As far as I know the additional tint is a built-in feature of the UIVisualEffectView class. If you examine the view hierarchy with Xcode, you can see that there are two default subviews in the visual effect view instance: UIVisualEffectBackdropView and UIVisualEffectSubview. (I assume that these are private classes.) If you inspect UIVisualEffectSubview you can see that it has a background color which causes the unwanted tint that you've noticed.
I am not sure if there's an officially supported way to remove it, but you can modify this background color by filtering to the name of the private subview:
if let vfxSubView = visualEffectView.subviews.first(where: {
String(describing: type(of: $0)) == "_UIVisualEffectSubview"
}) {
vfxSubView.backgroundColor = UIColor.white.withAlphaComponent(0.7)
}
(Swift 5 compatible)
The default tint is around 70% opacity, so the easiest is to use the target background color with 0.7 alpha component.
I've also noticed that this might reset to the default value if the visual effect contains a custom subview. If I add this same snippet to the viewDidLayoutSubviews function of the view's controller, then it will keep the custom background color even after the built-in subview is updated.
Here's an example with a dark blur effect style. The top part shows the default tint and the bottom version has a custom black background color with 70% opacity.
If you just want the blur and your blurred view is gonna be stationary, you could use the UIImageEffects class and change the tintColor to a "full" white:
- (UIImage *)applyExtraLightEffect
{
UIColor *tintColor = [UIColor colorWithWhite:0.97 alpha:0.82];
return [self applyBlurWithRadius:20 tintColor:tintColor saturationDeltaFactor:1.8 maskImage:nil];
}
As far as I know you can't change it in the UIVisualEffectView.
You can try :
var visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
visualEffectView.frame = imageView.bounds
imageView.addSubview(visualEffectView)
Simple Solution
I could find a simple solution inspired by Shannon Hughes' Blog Post. Just add a white background color with transparency to the effect view. I don't know if it is exactly like extraLight but for me it is close enough.
let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
visualEffectView.frame = sectionHeaderView.bounds
visualEffectView.backgroundColor = UIColor(white: 1.0, alpha: 0.9)
sectionHeaderView.addSubview(visualEffectView)
The following code should do the trick to give it a the desired tint:
let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .regular))
visualEffectView.subviews.forEach { subview in
subview.backgroundColor = UIColor.blue.withAlphaComponent(0.2)
}
Important Note:
I wouldn't recommend adding a check for "_UIVisualEffectSubview" since this class can change on subsequent iOS updates.
Also, there is a possibility of app getting rejected because of this.
iOS 15 has the nice
.background(.ultraThinMaterial)
but it still suffers from the nasty grey tint. Wish there was an option to blur background views without any tint.
I tried a simple color-correct hack which worked for my background color but only in light mode! For dark mode I just made the background solid black (no translucent blur)
.background(
// negate the slight grey tint of ultrathinmaterial
Color("materialTintColorCorrect")
.background(.ultraThinMaterial)
)
My "materialTintColorCorrect" color asset was #F0F8FF 27% opacity for light mode and #000000 100% opacity for dark.
let vc = UIViewController()
vc.view.frame = self.view!.frame
let efv = UIVisualEffectView(effect: UIBlurEffect(style: UIBlurEffectStyle.light))
efv.frame = vc.view.frame
vc.view.addSubview(efv)
self.addChildViewController(vc)
self.view.addSubview(vc.view)
// below method has a bug
// self.present(vc, animated: true, completion:nil)
I would recommend adding your extraLightView to a view of UIColor(white: 1.0, alpha: 0.x), where x can be modified based on the scroll view's contentOffset. When there's nothing behind the view, your extraLightView will be white when x is 1. When you scroll and modify x, you won't be modifying the UIVisualEffectView (which is highly discouraged), but rather its parent view, which is perfectly safe.
Works with Swift 5
My way of making the visual effect view completely white when the background view is white.
let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
blurView.backgroundColor = UIColor.white.withAlphaComponent(0.7)

Swift: How to change tableHeaderView's border color programatically in a tableViewController

I try to change the headerView's border color to surfing green, but it seems that my code does not work. What I tried is this:
tableView.tableHeaderView?.layer.borderColor = UIColor(red: 105.0/255.0, green: 215.0/255.0, blue: 189.0/255.0, alpha: 1.0).CGColor
tableView.tableHeaderView?.layer.masksToBounds = true
However, the header's border still looks like this:
Here is the Image (Sorry I do not have enough reputation to post images)
As you can see, the border is still black/deep blue.
Any help would be greatly appreciated! Thanks in advance!
I think there is problem with border between navigation bar and search bar...
check on this link for solution
searchBar.backgroundImage = UIImage()
some example to change border:
searchBar.layer.borderWidth = 1
searchBar.layer.borderColor = someColor.CGColor

Resources