Odrakir
Odrakir

Reputation: 4254

iOS 7 UISearchBar right spacing

Don't know why, my search bar in iOS 7 is leaving a right space. It's ok in iOS 6.

I know it has something to do with the section index, because if I remove it the space disappears, but I don't know how to fix it. Any thoughts?

enter image description here

Upvotes: 7

Views: 5619

Answers (10)

Michael Shang
Michael Shang

Reputation: 756

self.contactsTableView.sectionIndexBackgroundColor = [UIColor clearColor];

The reason for that white edge is because your index layer has a white background and is on top of the search bar. This should be sufficient.

Upvotes: 3

Xueshi
Xueshi

Reputation: 114

The problem is the right white block, so if we change the block color the same as the search bar background, it looks normal.

just

if (IOS7) {
    self.tableview.backgroundColor = [UIColor colorWithPatternImage:self.searchBar.backgroundImage];
}

Upvotes: 0

Swinny89
Swinny89

Reputation: 7373

I had this same issue with the iPhone 6/ 6Plus when using a SearchDisplayController. (Using Swift)

I tried setting the frame of the search bar but with no luck but i noticed that if i tapped on the textField of the UISearchBar and then cancelled it then it would take on the proper size of the view. I therefore managed to fix the issue by calling the code below in ViewDidLoad of the viewController using the search.

self.searchController.setActive(true, animated: false)
self.searchController.setActive(false, animated: false)

Upvotes: 4

txulu
txulu

Reputation: 1812

The accepted solution with the method viewDidLayoutSubviews makes the screen flicker. Instead what I did was create a subclass of UISearchBar that simply does this:

FullWidthSearchBar.h:

@interface FullWidthSearchBar : UISearchBar
@end

FullWidthSearchBar.m:

#import "FullWidthSearchBar.h"
@implementation FullWidthSearchBar

- (void)setFrame:(CGRect)frame {
    frame.size.width = self.superview.bounds.size.width;
    [super setFrame:frame];
}

@end

And then I assigned that class to the search bar on my xib:

enter image description here

Upvotes: 0

zedzhao
zedzhao

Reputation: 517

enter image description here

Add the search bar inside a UIView put as tableView's header view. Set the tableview's sectionIndexBackgroundColor to clear color because it covers the header.

Tested with iOS 7, 7.1;

Upvotes: 2

Chuckels5584
Chuckels5584

Reputation: 551

I added the search bar as a subview of the top-level view instead of the table view. Used autolayout to pin the searchbar to the top guide, and a vertical space constraint of 0 between the search bar and the table view.

Upvotes: 0

Chad Podoski
Chad Podoski

Reputation: 1003

Embed your UISearchBar in a UIView and then add that as the tableHeaderView. Structuring it that way in a storyboard worked for me. I'm guessing iOS resizes the UISearchBar in the tableHeaderView, but leaves a basic UIView alone (and doesn't bother to look inside it).

You might also want to make the section index transparent, which I did with:

[[UITableView appearance] setSectionIndexBackgroundColor:[UIColor clearColor]];
[[UITableView appearance] setSectionIndexTrackingBackgroundColor:[UIColor clearColor]];

Upvotes: 7

Quang Hà
Quang Hà

Reputation: 4744

Because the table view always leaves 15px on the right for section Indexes View, so you should resize the Seach bar after reloading the table view

First:

self.tblData.sectionIndexBackgroundColor = [UIColor clearColor]; //(iOS >= 7 only)

Cheating time:

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{

    [self performSelector:@selector(resizeSearchBar) withObject:nil afterDelay:0.01];
}
- (void) resizeSearchBar
{
    CGRect frame = self.searchBar.frame;
    if (frame.size.width < self.tblData.frame.size.width) {
        frame.size.width = self.tblData.frame.size.width;
    }
    self.searchBar.frame = frame;
}
- (void) reloadTableData // call it anytime you want to reload table view
{
    [self.tblData reloadData];
    [self performSelector:@selector(resizeSearchBar) withObject:nil afterDelay:0.01];
}

Suggest Dont cheat like me, just do the simpler way:

self.searchBar.searchBarStyle = UISearchBarStyleMinimal; // iOS >= 7 only

Upvotes: 1

Odrakir
Odrakir

Reputation: 4254

Until a better answer appears, I just manually changed the frame of the search bar like this:

- (void)viewDidLayoutSubviews {
    [super viewDidLayoutSubviews];        

    CGRect barFrame = self.searchBar.frame;
    barFrame.size.width = self.view.bounds.size.width;
    self.searchBar.frame = barFrame;

}

Upvotes: 6

Vaibhav Saran
Vaibhav Saran

Reputation: 12908

I also attached a UISearcBar in my application, and nothing is wrong there even my application supports rotation also.

Could you try removing and re creating UISearchBar in storyboard/xib

Upvotes: 0

Related Questions