iOS7, backgroundImage for UISearchBar

Question

I'm making the transition of the UI between iOS 6 and iOS 7.

We have a UISearchBar related to a UISearchDisplayController, I have set the backgroundImage of the navigationBar and the searchBar to a 1x1 image dynamically created with a color.

self.searchDisplayController.searchBar.translucent = NO;
self.searchDisplayController.searchBar.barTintColor = [UIColor clearColor];
self.searchDisplayController.searchBar.tintColor = [UIColor myTintColor];
self.searchDisplayController.searchBar.backgroundImage = [self imageWithColor:[UIColor myBGColor]];
self.searchDisplayController.searchBar.scopeBarBackgroundImage = [self imageWithColor:[UIColor myBGColor]];

On iOS6, everything works as expected. On iOS7, when the searchBar is selected, the scopeBar appears with the good backgroundImage (set with searchBar.scopeBarBackgroundImage) but the searchBar is a kind of translucent gray. When I press on Cancel, the searchBar backgroundImage is back.

/////////////////////////////////////////////////////////////////////////////////////////////////////

EDITED QUESTION

/////////////////////////////////////////////////////////////////////////////////////////////////////

Actually, I did use the barTintColor and other options here and there but it doesn't work. That is the result with the barTintColor set with the same color. But there is this white layer on top

Mysterious

Answer 1

In iOS 7, the properties backgroundImage and scopeBarBackgroundImage no longer work as expected and become translucent.

The following method has been introduced in iOS 7 which addresses this problem. (Docs here)

setBackgroundImage:forBarPosition:barMetrics:

Here's what you should do :

 [self.searchDisplayController.searchBar setBackgroundImage:[self imageWithColor:[UIColor yourColor]] 
                                             forBarPosition:0 
                                                 barMetrics:UIBarMetricsDefault];

Here, barPosition : 0 is UIBarPositionAny.

Edit:

Swift code:

self.searchDisplayController.searchBar.setBackgroundImage(self.image(color: UIColor.yourColor), for: UIBarPosition(rawValue: 0)!, barMetrics:.default)

Ossetia

Thanks for the help but unfortunately it doesn't change! – Mysterious

Check out the edited answer and tell me if it works! – Ossetia

You made it! Thanks a lot!! – Mysterious

I 've been looking for ages, this answer helps a lot! – Demi

spend half a day - you really save my time! – Proctor

Answer 2

I was able to replicate what you were trying to do and it seems to work for me if I set the barTintColor to my color choice.

I'd suggest trying:

self.searchDisplayController.searchBar.barTintColor = [UIColor myBGColor];

I did [UIColor redColor] and got the results I expected.

Awlwort

I edited my question with the screenshot of the result. It's not what I expect, did you have the same result? – Mysterious

It shouldn't be doing what you are showing if you have translucent set to NO as it appears you do. It looks like you are using an image for your color, have you tried just using a solid color, such as [UIColor blueColor] – Awlwort

Answer 3

If you set the barTintColor property of your search bar, you will get what you are expecting. I've just tried this and it works:

self.searchDisplayController.searchBar.barTintColor = [UIColor yellowColor];

Keep in mind that barTintColor property was introduced in iOS 7.

Chinoiserie

Thanks for the help. I edited my question with the screenshot of the result. It's not what I expect, did you have the same result? – Mysterious

There isn't a white layer, its looking that way because it is translucent. Try this self.searchDisplayController.searchBar.translucent = NO; – Chinoiserie

Unfortunately, it's already the case. It seems that this searchBar is broken – Mysterious

I'm seeing the same thing. UISearchBar doesn't seem to respect its translucent property. – Pistachio

Answer 4

Since there is no current Swift version, I'll just leave this here for future use, as I have been struggling with it for pretty long time as well.

1. get yourself 1px image with desired color (even clear)

2. set it as a backgroundImage using:

   searchController.searchBar.setBackgroundImage(UIImage(named: "red"), for: .any, barMetrics: .default)

Ottinger