Activating the search bar does not hide the navigation bar

Question

I have an iOS 7 application in Xcode 5.0 that exhibits strange behavior when I click on the search bar ( UISearchBar ).

My application has a navigation controller and a tab bar controller. Here is an example of what my Main.Storyboard looks like:

 [Navigation Controller] -> [Tab Bar Controller] -> [Tab Item #1] | -------------> [Tab Item #2] Each [] is a view controller 

When I launch my application, I see Tab Item 1 with a UISearchBar , as shown in the screenshot below:

When I click on the UISearchBar , the search bar slides at the top of the screen, but the navigation bar does not hide, and the view does not "slide up." This causes the application to look like this:

When I remove the Tab Bar Controller from the storyboard and connect the Navigation Controller directly to Tab Item #1 , the navigation bar hides as expected.

How to make the navigation bar hide when I click on the search bar? For an example of the functionality I'm looking for to play, click the search bar on the Contacts tab of the IOS7 Phone app by default.

Answer 1

You can use the UISearchBar delegate methods to decide when to display the navigation bar.

 -(void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar{ [UIView animateWithDuration:0.2 animations:^{ CGRect statusBarFrame = [[UIApplication sharedApplication] statusBarFrame]; double yDiff = self.navigationController.navigationBar.frame.origin.y - self.navigationController.navigationBar.frame.size.height - statusBarFrame.size.height; self.navigationController.navigationBar.frame = CGRectMake(0, yDiff, 320, self.navigationController.navigationBar.frame.size.height); }]; } -(void)searchBarTextDidEndEditing:(UISearchBar *)searchBar{ [UIView animateWithDuration:0.2 animations:^{ CGRect statusBarFrame = [[UIApplication sharedApplication] statusBarFrame]; double yDiff = self.navigationController.navigationBar.frame.origin.y + self.navigationController.navigationBar.frame.size.height + statusBarFrame.size.height; self.navigationController.navigationBar.frame = CGRectMake(0, yDiff, 320, self.navigationController.navigationBar.frame.size.height); }]; } 

Answer 2

For developers of fast :

 func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) { navigationController?.setNavigationBarHidden(true, animated: true) } func searchBarTextDidEndEditing(_ searchBar: UISearchBar) { navigationController?.setNavigationBarHidden(false, animated: true) } 

This will hide the navigation bar while the search bar is active, and show it again when the search bar is inactive.

Answer 3

You can set the top bar in the navigation controller for the list, to anyone, and then add this to your tabBarController code:

 self.navigationController.navigationBar.translucent= NO; 

In the viewDidLoad method

Answer 4

You can do this using the UISearchDisplayController method;

 -(void)searchDisplayControllerWillBeginSearch:(mySearchDisplayController *)controller { self.searchResultsDataSource = self; self.searchResultsTableView.delegate = self; if (floor(NSFoundationVersionNumber) > NSFoundationVersionNumber_iOS_6_1) { CGRect statusBarFrame = [[UIApplication sharedApplication] statusBarFrame]; [UIView animateWithDuration:0.01 animations:^{ for (UIView *subview in self.searchBar.subviews) subview.transform = CGAffineTransformMakeTranslation(0, statusBarFrame.size.height); }]; } } -(void)searchDisplayControllerWillEndSearch:(mySearchDisplayController *)controller { if (floor(NSFoundationVersionNumber) > NSFoundationVersionNumber_iOS_6_1) { [UIView animateWithDuration:0.01 animations:^{ for (UIView *subview in self.searchBar.subviews) subview.transform = CGAffineTransformIdentity; }]; } } 

Remember to create a new class as the UISearchDisplayController type and implement this code in it.

Answer 5

I understand that it is probably too late to help you, but today I ran into the same problem!

I solved this by setting limits in the search bar. Make sure the search bar has a 0px limit for its immediate top neighbor (navigation bar). Also make sure that the table view below the search bar has a 0px limit for its closest upper neighbor (search bar).

Not sure about the specific problem you are facing, but this fixed it for me.

Answer 6

I solved the problem by adding a restriction to the search bar in the Top Layout Guide and setting its value to 0 and adding a vertical span to the search bar and setting its value to 0;