UISearchBar and/or UISearchDisplayController color

Question

UPDATE: Thanks for all the answers. I would like to add that the search bar used is actually a UISearchBar embedded as part of UISearchDisplayController that is set to the a UITableView's header.

I've created a sample project exhibiting this behavior here: https://dl.dropboxusercontent.com/u/3497087/TestSearchDisplayController.zip. I tried setting the barTintColor to blue and black. The most obvious thing is that when setting to black, I get a grayish bar.

I appreciate all answers and ideas, thank you.

I am working on skinning the app that I'm currently working on, and I seem to hit a roadblock with UISearchBar and/or UISearchDisplayController bar color.

The first issue I have revolves around setting the barTintColor for UISearchBar that is attached as a tableview header. I've set it to blackColor in Interface Builder. However, when the app runs, the color doesn't seem to be black, but some sort of gray, with an ugly white line above! I've tried setting this thru code, but that doesn't seem to help too. See screenshots below.

UISearchBar barTintColor set to black in IB

UISearchBar barTintColor when running on simulator

My second question revolves around UISearchDisplayController. I wanted black color when the search display controller takes over the top of the screen. I've tried setting the color code, but the only color that it won't take is, again, black color!

@Sunnyshah tintColor will not change the bar color, but will instead change the text color for the Cancel bar button item. — XCool, Jan 17 '14 at 04:14
Try to change color of UINavigationBar with black color and check. — Krunal, Jan 17 '14 at 05:59

codercat · Accepted Answer · 2014-01-17T07:59:20.740

9

 [[UISearchBar appearance] setBackgroundImage:[UIImage imageNamed:@"black"]];

enter image description here

check out your sample project

enter image description here

edited Jan 17 '14 at 07:59

answered Jan 17 '14 at 05:29

codercat

22,873
9
61
85

Yup, that's the issue I'm facing. If I detach the UISearchBar from the searchDisplayController, I can skin it properly. But that means I lose the functionality that came with the searchDisplayController. – XCool Jan 17 '14 at 07:31
1

because the search display controller have self translucent effort – codercat Jan 17 '14 at 07:47
do you know if it's possible to change that? – XCool Jan 17 '14 at 07:48
after dismiss pulldown tableview to able see searchbar – codercat Jan 17 '14 at 08:04
Sorry, I upvoted, but forgot to click on the tick to accept. Done. Thanks again! – XCool Jan 17 '14 at 08:25
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/45440/discussion-between-xcool-and-idev) – XCool Jan 17 '14 at 08:26

score 5 · Answer 2 · edited Oct 29 '17 at 16:10

5

You can try with this:

_searchBar.barTintColor = [UIColor blackColor]; // change the barColor     
_searchBar.tintColor = [UIColor whiteColor]; // change the title color

edited Oct 29 '17 at 16:10

Marián Černý

15,096
4
70
83

answered Jun 20 '14 at 06:28

user3759066

51
1
1

score 3 · Answer 3 · answered Dec 16 '16 at 10:49

3

It's as simple as setting searchBar.barTintColor to the color you want. No need for images. searchBar.tintColor changes the color of the Cancel button.

answered Dec 16 '16 at 10:49

score 3 · Answer 4 · answered Dec 17 '16 at 14:40

I just add a helper function to set everything, including the cancel button color (tint.color). This called in ViewDidLoad:

//Set the searchbar settings, delegates
func setSearchBar() {

    searchController = UISearchController(searchResultsController: nil)
    searchController.searchResultsUpdater = self
    searchController.searchBar.placeholder = "Enter Search Text"
    searchController.searchBar.barTintColor = UIColor(red: 72/255, green: 100/255, blue: 156/255, alpha: 1)
    searchController.searchBar.tintColor = UIColor.white

    searchController.hidesNavigationBarDuringPresentation = false
    searchController.dimsBackgroundDuringPresentation = false
}

You can also set own color for searchbar color (barTintColor). This works in Xcode 8 and Swift 3.

score 2 · Answer 5 · edited May 23 '17 at 11:53

2

For your first question, I had the same issue few months ago. Have a look at: iOS7, backgroundImage for UISearchBar At the end, it uses the method:

setBackgroundImage:forBarPosition:barMetrics:

edited May 23 '17 at 11:53

Community

1
1

answered Jun 20 '14 at 06:38

Geraud.ch

1,499
10
15

score 0 · Answer 6 · answered Jan 17 '14 at 04:21

Getting control of the iOS 7 search bar background color is tricky. The easiest and most reliable approach: Make a solid black image and call setBackgroundImage:forBarPosition:barMetrics:. (Getting the second and third arguments right is also tricky!) Also explicitly set the bar's translucent to NO just to be on the safe side. Do all this in code; do not rely on Interface Builder to get things right.

score 0 · Answer 7 · answered Feb 26 '16 at 06:00

0

For Background Color of Searchbar :

For TintColor:

[self.searchDisplayController.searchBar setTintColor:[UIColor redColor]];

answered Feb 26 '16 at 06:00

Sanju

1,148
11
26

score -3 · Answer 8 · answered Jan 17 '14 at 05:42

-3

Hi You can try with this

 _searchBar.tintColor = [UIColor blackColor];
    _searchBar.backgroundColor = [UIColor clearColor];
    _searchBar.backgroundImage = nil;

answered Jan 17 '14 at 05:42

Harunmughal

367
1
4

You need to use the barTintColor property for ios7. thanks dear – Harunmughal Jan 17 '14 at 05:57
don't give a reputation it totally irreverent to above question – codercat Jan 17 '14 at 06:30

UISearchBar and/or UISearchDisplayController color

8 Answers8

For Background Color of Searchbar :

For TintColor: