UISearchBar display bug: text too far left, overlapping the magnifying glass icon

Question

I have encountered the weirdest display bug with my UISearchBar.
Here is my code that works perfectly in another app. (I create the search bar in code because a xib file is not feasible.)

searchBar = [[UISearchBar alloc] initWithFrame:
    CGRectMake(0, 0, self.tableView.frame.size.width, 44)];
searchBar.delegate = self;
searchController = [[UISearchDisplayController alloc] 
                   initWithSearchBar:searchBar contentsController:self];
searchController.delegate = self;
searchController.searchResultsDataSource = self;
searchController.searchResultsDelegate = self;
self.tableView.tableHeaderView = searchBar;

The search functionality etc. works fine. But strangely, the search bar looks like this, both on the device and the simulator:

UISearchBar with display bug

The placeholder string should not be there, but further to the right.
When I enter search text it also starts too far left, with the magnifying glass icon showing through.
Also, setting searchBar.placeholder or searchBar.prompt to @"" or nil does not remove this "Search" placeholder. (However, a
searchBar.placeholder = @"FooBar";
will display "FooBar", but still in the wrong position.
Finally, I find it strange that the string is "Search" although I have set the language to something else (say, German).

Any help? The most pressing problem is to get the text to over the right.

I just noticed that the index titles on the right (you can see the "A" and the search symbol in the image) automagically shift the right edge of the search box to the left. Perhaps it also shifts the placeholder / search string by the same distance (although it should not)? — Mundi
I had the same problem with my application. It was fine in my previous version. However, it just happened recently. I am still looking for solution. BTW, my searchBar is defined in XIB. — RoIT

ipaterson ipaterson · Accepted Answer · 2011-07-21T23:29:04

That behavior can be caused by overriding either (CGRect)editingRectForBounds:(CGRect)bounds or - (CGRect)textRectForBounds:(CGRect)bounds. Have you altered either of those in a UITextField category elsewhere in your app? The purpose of doing that may have been to add padding to a text field (which can instead be accomplished with an invisible leftView). In this case, your custom "padding" is being applied to the UISearchBar text field.

Such a category on UITextField will also cause your app to crash while initializing framework classes that use UITextField, such as MFMailComposeViewController, so it is a bad idea for several reasons.

UISearchBar display bug: text too far left, overlapping the magnifying glass icon

1 Answers