Quick tip: iOS animation on UISearchBar

As we can see with successful apps, transitions, animations and minimalistic design are great approach on mobile development.

Here I’ll give some quick tips when you’re using UISearchBar on iOS.

This post is about the following effects:

In our case, we already have UISearchBar in our .xib and UISearchBarDelegate as protocol on @interface (.h) file.

MyOwnViewController.h

@interface MyOwnViewController : UIViewController <UISearchBarDelegate> {

Don’t forget to set SearchBar’s Delegate on xib. This will link the “actions” of xib with you code.

And the most important, the .m implementation:

UISearchBarDelegate has many Delegate Methods. Here we’ll be using

searchBarTextDidBeginEditing:(UISearchBar *)searchBar (that is called when the user touches SearchBar) and
searchBarTextDidEndEditing:(UISearchBar *)searchBar (that is called when the user touches Cancel or Search)

The code is the following:

MyOwnViewController.m

- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {
    [searchBar setShowsCancelButton:YES animated:YES];
    [self.navigationController setNavigationBarHidden:YES animated:YES];
}

MyOwnViewController.m

- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {
    [searchBar setShowsCancelButton:NO animated:YES];
    [self.navigationController setNavigationBarHidden:NO animated:YES];
}