Transparent background UISearchView

By | September 8, 2012

While I was working on a small iPhone application I was required to put a search box but with a transparent background. The original design looks like this:

I could not get the basic search control to not display its background. I tried using a standard text box, however the look and feel was not the same (the standard text view has round corners but here the whole side needs to a single half-circle).

I found a solution on stackoverflow.com : http://stackoverflow.com/questions/2913475/uisearchbar-transparent-background-view

However, the solutions I found there were not optimal because they required custom code for each usage of a search box with transparent background.

I really wanted a more reusable solution. I adapted one of the solutions but subclassed UISearchBar as follow:

in UITransparentBackgroundSearchBar.h:

and in UITransparentBackgroundSearchBar.m:

In your storyboard, set the search bar class to be UITransparentBackgroundSearchBar and voilà.

I am not that experienced with iOS development so there might be a gotcha I have not identified yet. I seems quite clean so I pretty confident.

Have fun,
TiMoch on edge

Leave a Reply