Change the magnifying glass icon on a UISearchBar

Question

I want to be able to set my own image for the little magnifying glass icon on a UISearchBar. I'd also like to be able to move it around if possible. Any ideas? Currently, I only need support for iOS5 and above.

Solution 1

For apps which supports iOS 5 onwards, you can use the below method to do this,

- (void)setImage:(UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state; 

UIControlStateNormal and UIControlStateDisabled are the two possible states for search bar.

For apps which uses OS version before this, this wont work. You might have to create a category on UISearchbar and change the icon by enumerating the subviews.

Solution 2

If you want to just change the color of the default magnifying icon, you can set the image to use template mode and then set the image view’s tintColor.

if ([view isKindOfClass:[UITextField class]]) {
    UITextField *textField = (id)view;

    UIImageView *iconView = (id)textField.leftView;
    iconView.image = [iconView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
    iconView.tintColor = <##dimmedColor##>;

    // other styling:
    textField.font = <##font##>;
    textField.textColor = <##activeColor##>;
    textField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:<##searchBar##>.placeholder
                                                                      attributes:@{NSForegroundColorAttributeName: <##dimmedColor##>}];
}

Solution 3

For Swift :-

UISearchBar.appearance().setImage(UIImage(named: "new_search_icon"), forSearchBarIcon: UISearchBarIcon.Search, state: UIControlState.Normal)

Comments

[Admin]

@ACB was kind enough to answer this in another posting I had about UISearchBar where I asked this as an added question in the comments. He said: "You can use for iOS 5 app as mentioned below. For apps which uses OS version before this, this wont work. - (void)setImage:(UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state;"

[Colin Tremblay]

The imageWithRenderingMode was key. Missed it at first glance!

[gadu]

For others who are lazy or wanted a little further clarification (for example that this is a method for the UISearchBar): [self.searchController.searchBar setImage:[UIImage imageNamed:@"YourImageHere"] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal]; or wherever else you have your search controller/bar