Change UISearchbar Magnifying Glass Color, PlaceHolder Color, and X Color

Question

I've searched various solutions to accomplish this task but they are either in objective C or involve replacing the magnifying glass image.

Previous Posts I looked at:

Change color of magnifying glass

How to change UISearchBar Placeholder and image tint color?

The reason I dont want to replace the image of the magnifying glass is because the page color is dynamic and there are over 100+ color combinations

Any help on changing the UISearchbar Magnifying Glass Color, PlaceHolder Color, and X Color would greatly be appreciated

Homogeneous

have you tried those posts you looked at ? Forget about replacing the image. What about placeholder colour and tint colour? Did you try anything? – Selfridge

Have you look at this tutorial yet: appcoda.com/custom-search-bar-tutorial – Barhorst

@Mr.T I've replaced the tintcolor which changes the font color of the typed text and cancel button but not the placeholder or X button. – Homogeneous

One of the posts you looked at suggests a way to change the placeholder colour , did u try that ? – Selfridge

@Mr.T I got the place holder textcolor to change using attributedtext properties. I'm still working on figuring out how to change the X and magnifying glass – Homogeneous

look at this #27945281 – Selfridge

@Mr.T would this be considered as modifying a private property or api which would result in my app getting rejected from the app store? – Homogeneous

Answer 1

Objective C :

NSArray *searchBarSubViews = [[self.searchBar.subviews objectAtIndex:0] subviews];
for (UIView *view in searchBarSubViews) {
    if([view isKindOfClass:[UITextField class]])
    {
        UITextField *textField = (UITextField*)view;
        UIImageView *imgView = (UIImageView*)textField.leftView;
        imgView.image = [imgView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
        imgView.tintColor = [UIColor whiteColor];

        UIButton *btnClear = (UIButton*)[textField valueForKey:@"clearButton"];
        [btnClear setImage:[btnClear.imageView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate] forState:UIControlStateNormal];
        btnClear.tintColor = [UIColor whiteColor];

    }
}
[self.searchBar reloadInputViews];

Swift :

// Text field in search bar.
let textField = searchController.searchBar.valueForKey("searchField") as! UITextField

let glassIconView = textField.leftView as! UIImageView
glassIconView.image = glassIconView.image?.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate)
glassIconView.tintColor = UIColor.whiteColor()

let clearButton = textField.valueForKey("clearButton") as! UIButton
clearButton.setImage(clearButton.imageView?.image?.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate), forState: .Normal)
clearButton.tintColor = UIColor.whiteColor()

Gaylagayle

Answer 2

Shahil's answer updated for Swift 3:

let textField = searchBar.value(forKey: "searchField") as! UITextField

let glassIconView = textField.leftView as! UIImageView
glassIconView.image = glassIconView.image?.withRenderingMode(.alwaysTemplate)
glassIconView.tintColor = .white


let clearButton = textField.value(forKey: "clearButton") as! UIButton
clearButton.setImage(clearButton.imageView?.image?.withRenderingMode(.alwaysTemplate), for: .normal)
clearButton.tintColor = .white

Cyclograph

Answer 3

func setupPlaceHolder(text: String, textColor: UIColor) {
  searchBar.searchTextField.attributedPlaceholder = NSAttributedString(
    string: text,
    attributes: [.foregroundColor: textColor]
  )
        
  searchBar.searchTextField.leftView?.tintColor = .white
}

Coe

Please fix the formatting of your answer. Also, code-only answers are not considered very helpful. it's best to explain what the code does and how it solves the issue in the question. – Strategic

Answer 4

For 2024

class UsableUISearchBar: UISearchBar {
    
    override init(frame: CGRect) {
        
        super.init(frame: frame)
        common()
    }

    required init?(coder aDecoder: NSCoder) {
        
        super.init(coder: aDecoder)
        common()
    }

    func common() {
        barTintColor = .clear
        searchTextField.backgroundColor = .darkGray
        searchTextField.leftView?.tintColor = .white
    }
}

Yes, init seems to be late enough to set the colors. (Obviously, depending on your house style you could do it in layout.)

Propel