Setting translucent to NO on UISearchBar

11,652

Solution 1

For UISearchBarStyleProminent:

1) Be sure to check the "Translucent" box for the search bar in the Attributes Inspector.

2) Add the following to viewDidLoad:

self.navigationController.navigationBar.translucent = NO; // If you have a navBar
self.searchDisplayController.searchBar.translucent = NO;

Edit From @RudolfAdamkovic:

"I've found that for UISearchBarStyleProminent, executing [the following] helps. That way, you can keep it on in Storyboard."
searchBar.translucent = YES;
searchBar.translucent = NO;

For UISearchBarStyleMinimal:

In order to get the minimal search bar to not be translucent I have put together a workaround.

1) Be sure to check the "Translucent" box for the search bar in the Attributes Inspector.

2) Add the following code to viewDidLoad:

self.navigationController.navigationBar.translucent = NO;
self.searchDisplayController.searchBar.translucent = NO;
self.searchDisplayController.searchBar.backgroundColor = [UIColor desiredColor];

3) A UIView needs to be added to the viewController. This view needs to be 20px heigh and should have the same color as the searchBar.barTintColor.

Note: I think this workaround is needed because: "The style UISearchBarStyleMinimal provides no default background color or image but will display one if customized as such." Thus the only way to get this functionality for UISearchBarStyleMinimal is to set the backgroundColor.

See UISearchBar documentation for more details.

Solution 2

None of the above answers worked for me on iOS 7/8. Here's some setup code that did the trick:

searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.frame), 44)];
searchBar.scopeButtonTitles = @[@"Scope1", @"Scope2"];
searchBar.selectedScopeButtonIndex = 0;
searchBar.backgroundColor = [UIColor clearColor];
searchBar.barTintColor = [UIColor clearColor];
searchBar.translucent = YES; // SUPER IMPORTANT, REMOVING THIS MESSED UP THE SCOPE BAR

// ONLY USE IMAGES, NOT BACKGROUND COLORS
UIImage *searchBarBackgroundImage = [[UIImage imageNamed:@"SearchBarBackgroundImage"];
UIImage *scopeBarBackgroundImage = [[UIImage imageNamed:@"ScopeBarBackgroundImage"];
[searchBar setBackgroundImage:searchBarBackgroundImage
               forBarPosition:UIBarPositionAny
                   barMetrics:UIBarMetricsDefault];
searchBar.scopeBarBackgroundImage = scopeBarBackgroundImage;
searchBar.tintColor = [UIColor whiteColor];
Share:
11,652
Jason Hocker
Author by

Jason Hocker

By Day: iOS and Android developer By Night: Bracketologist, Ice Cream R&D

Updated on June 07, 2022

Comments

  • Jason Hocker
    Jason Hocker almost 2 years

    We have a UITableView with a searchbar added with the searchDisplayController.

    We want to have translucency off throughout the app.

    I have the translucency off for the navigation bar and other bars, but not the search bar when it uses the display controller. In one part of the app when we use the search bar but not the display controller, the translucency is set correctly.

    How can I set the translucent property of the UISearchBar with the display controller to be NO?

    EDIT: this is my code in viewDidLoad

    self.navigationController.navigationBar.translucent = NO;
    BOOL t = self.searchDisplayController.searchBar.translucent;
    self.searchDisplayController.searchBar.translucent = NO;
    self.navigationController.navigationBar.barTintColor = [UIColor redColor];
    self.searchDisplayController.searchBar.barTintColor = [UIColor redColor];
    UIBarStyle b1 = self.searchDisplayController.searchBar.barStyle;
    UISearchBarStyle b2 = self.searchDisplayController.searchBar.searchBarStyle;
    BOOL t2 = self.searchDisplayController.searchBar.translucent;
    

    Running in the debugger, t = YES and t2 = YES. b1 = UIBarStyleDefault and b2 = UISearchBarStyleDefault. Am I setting NO at the wrong spot? Ive tried the setting in the storyboard and here in viewDidLoad

  • Jason Hocker
    Jason Hocker over 10 years
    That did not work, which is why I posted the question. I wish I could accept this answer as correct.
  • James Nelson
    James Nelson over 10 years
    Yeah, sorry. I just noticed that this is not the complete answer. I have updated the answer and have verified it works for me.
  • Jason Hocker
    Jason Hocker over 10 years
    Why are my translucent variables set to YES? Setting the color after setting the translucent property didn't make a difference. I think its translucency I'm seeing... if we make the navigation a red color, the search bar under it looks red-pinkish.
  • James Nelson
    James Nelson over 10 years
    @JasonHocker - Is your searchBar's translucency turned off in the storyboard? I ask because whenever I turned it off via the storyboard I could not updated it programmatically (meaning every time I set it NO it was still YES). Once I turned translucency on in the storyboard I was able to programmatically set the value and log its change.
  • James Nelson
    James Nelson over 10 years
    @JasonHocker I created a new project using your code and found that checking and unchecking the "Translucent" box in the storyboard makes the code effective or not.
  • Jason Hocker
    Jason Hocker over 10 years
    Your advice about not setting it in the storyboard solved my problem of the code taking no effect with the variables. However, it did not change the visual appearance. Do I need/can set the translucent value on the UISearchDisplayController? Is setting the UISearchBar not the thing I need to change?
  • Jason Hocker
    Jason Hocker over 10 years
    I think the search bar is a UISearchBarStyleProminent because its actually the default, so I think thats the same as prominent. But, I'm willing to try your suggestions for UISearchBarStyleMinimal. I don't understand where this UIView that is 20px high goes.
  • James Nelson
    James Nelson over 10 years
    I have set up a sample project on git which outlines how I am getting UISearchBarStyleProminent to work. github.com/jameswhcc/NavPlusSearchBar
  • Jason Hocker
    Jason Hocker over 10 years
    Thanks James, but you didn't change the color. I forked the project and changed the red color. You'll see that the navigation and search bars do not match github.com/jasonhocker/NavPlusSearchBar
  • James Nelson
    James Nelson over 10 years
    @JasonHocker I just updated the project on git to show how to get the blur removed. Sorry, I did not fully understand your goal.
  • Jason Hocker
    Jason Hocker over 10 years
    Thank you , that did it. Do we think this is a bug that the background view is necessary? I'm wondering if this will get "fixed"... any hard in putting in this code in the future?
  • James Nelson
    James Nelson over 10 years
    Great, I am glad. By "hard" do you mean harm? If so I do not think there is an harm in putting in this code in the future. As for it being a bug, I am not sure Apple is terribly fond of us trying to use search bars without some form of translucency; I say this because I cannot think of an instance where iOS 7 does. That being said, yes it seems like a bug which apple should fix.
  • Rudolf Adamkovič
    Rudolf Adamkovič over 9 years
    @JamesNelson Thanks for the answer. I've been pulling my hair for 15 minutes. By the way, I've found that for UISearchBarStyleProminent, executing searchBar.translucent = YES; searchBar.translucent = NO; helps. That way, you can keep it on in Storyboard.