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.

@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;" — , Nov 17 '12 at 04:12

score 35 · Accepted Answer · answered Nov 17 '12 at 06:42

35

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.

answered Nov 17 '12 at 06:42

iDev

23,310
7
60
85

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 – gadu Oct 06 '15 at 02:46

score 13 · Answer 2 · answered Apr 07 '14 at 08:59

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##>}];
}

The imageWithRenderingMode was key. Missed it at first glance! — Colin Tremblay, Mar 02 '15 at 18:38

score 3 · Answer 3 · answered Feb 10 '16 at 12:23

3

For Swift :-

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

answered Feb 10 '16 at 12:23

Vivek Bansal

1,301
13
21

score 0 · Answer 4 · edited Dec 17 '13 at 07:43

0

Use

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

edited Dec 17 '13 at 07:43

dandan78

13,328
13
64
78

answered Nov 21 '12 at 20:56

score 0 · Answer 5 · answered Jun 30 '20 at 06:28

0

For Swift 5

  searchBar.setImage(UIImage(named: "your_favicon"), for: .search, state: .normal)

answered Jun 30 '20 at 06:28

kumar

151
1
12

score -2 · Answer 6 · answered Nov 17 '12 at 07:48

-2

try print all subviews... iOS indipendent.

for (id obj in _SearchBar.subviews) {
  NSLog(@"%@", obj);

  if ( [obj isKindOfClass:[UIImage class]] )  {
     NSLog(@"probably found...");

     UIImage *img = obj;
     [img setImage....];
  }
}

answered Nov 17 '12 at 07:48

elp

8,021
7
61
120

Change the magnifying glass icon on a UISearchBar

6 Answers6