在UISearchBar左侧添加按钮

Question

我正在把这头发撕掉。我的客户想要在搜索栏的左侧添加一个按钮，如下例所示：

alt text http://www.erik.co.uk/images/IMG_0008.PNG

但我无法弄明白该怎么做。 Apple似乎没有提供任何记录方法来向UISearchBar添加自定义按钮，更不用说在搜索栏的左侧。

我已经尝试在Interface Builder中添加一个UIToolbar，左边有一个按钮，但我找不到任何样式组合，两者排列正确，给人的印象是它们是一个。从下图中可以看出，垂直对齐中始终存在一个像素差异：

alt text http://www.erik.co.uk/images/verticalalignment.png

我一直在搜索，但找不到答案，但正如我们从截图中看到的那样，它必须是可能的！

提前感谢您的帮助。

埃里克

Answer 1

使用导航栏而不是工具栏。将搜索栏设置为导航栏的标题视图。

在Interface Builder：

结果：

Answer 2

您可以替换书签图像，并在必要时调整其偏移量。
例如：

[self.searchDisplayController.searchBar setImage:[UIImage imageNamed:@"plus2"] forSearchBarIcon:UISearchBarIconBookmark state:UIControlStateNormal];
[self.searchDisplayController.searchBar setPositionAdjustment:UIOffsetMake(-10, 0) forSearchBarIcon:UISearchBarIconBookmark];

在委托方法中处理按钮事件：

- (void)searchBarBookmarkButtonClicked:(UISearchBar *)searchBar

它的外观如下：

Answer 3

第一个解决方案是使用UINavigationBar而不是UIToolbar，正如KennyTM所注意到的那样。但是你可能不满意导航栏，就像在我的情况下，我需要使用3个按钮（导航栏只允许使用2个按钮） - 见左图。我就这样做了：

1. 在显示搜索栏的位置使用Toolbar 3个按钮和Flexible Space Bar Button Item。
2. 将搜索栏放在（不在）工具栏上。要在Interface Builder中执行此操作，请勿拖放删除工具栏上的搜索栏。相反，将它放在附近的某个地方，然后使用键盘上的箭头键（或通过更改Interface Builder中的X＆amp; Y位置）将其移动到位。
3. 搜索栏左下方有黑线（见右图）。为了隐藏它，我添加了一个高度为1px且背景为白色背景的视图。

对我来说这看起来有点脏，所以如果你有更好的解决方案，请告诉我。

Answer 4

最简单的解决方案是将您的搜索栏添加到工具栏的顶部（不在其中），我为您提供了我在公司eBuildy中使用的最佳解决方案：

UIBarButtonItem *mySettingsButton = [[UIBarButtonItem alloc] initWithTitle:@"Settings" style:UIBarButtonItemStyleBordered target:self action:@selector(refresh)];
UIBarButtonItem *mySpacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
UIBarButtonItem *myRefreshButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh target:self action:@selector(refresh)];
UIToolbar *myTopToolbar = [[UIToolbar alloc]initWithFrame:CGRectMake(0,0,320,40)];
UISearchBar *mySearchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(70,1,220,40)];

[myTopToolbar setItems:[NSArray arrayWithObjects:mySettingsButton,mySpacer,myRefreshButton, nil] animated:NO];
[self.view addSubview:myTopToolbar];
[self.view addSubview:mySearchBar];

Answer 5

在这里回答一个老问题，但我最近自己也在努力解决这个问题，并且发现了我试图解决的情况的其他答案的一些缺点。这是我在UISearchBar的子类中所做的：

首先添加一个UIButton属性（此处为＆＃34; selectButton＆＃34;）。然后覆盖initWithFrame方法并执行类似于以下操作：

-(id)initWithFrame:(CGRect)frame{
if (self = [super initWithFrame:frame])
{
    self.selectButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    self.selectButton.contentEdgeInsets = (UIEdgeInsets){.left=4,.right=4};
    [self.selectButton addTarget:self action:@selector(pressedButton:) forControlEvents:UIControlEventTouchUpInside];

    self.selectButton.titleLabel.numberOfLines = 1;
    self.selectButton.titleLabel.adjustsFontSizeToFitWidth = YES;
    self.selectButton.titleLabel.lineBreakMode = UILineBreakModeClip;

    [self addSubview:self.selectButton];
    [self.selectButton setFrame:CGRectMake(5, 6, 60, 31)];
}

return self;
}

现在，您要覆盖布局子视图方法，以将搜索栏的大小调整为适当的宽度，具体取决于是否显示取消按钮。这应该是这样的：

-(void)layoutSubviews
{
[super layoutSubviews];

float cancelButtonWidth = 65.0;
UITextField *searchField = [self.subviews objectAtIndex:1];

if (self.showsCancelButton == YES)
    [searchField setFrame:CGRectMake(70, 6, self.frame.size.width - 70 - cancelButtonWidth, 31)];
else
    [searchField setFrame:CGRectMake(70, 6, self.frame.size.width - 70, 31)];
}

请注意，在上面的方法中，我为cancelButtonWidth添加了一个常量。我尝试添加代码以从[self cancelButton]获取宽度，但这似乎只能在运行时访问，并且不允许项目编译。无论如何，这应该是您需要的良好开端

Answer 6

如果您想要一个自定义按钮，取代Cancel按钮，只需使用此代码（适用于iOS 9及更高版本）：

[self.searchBar setShowsCancelButton:YES];
[[UIBarButtonItem appearanceWhenContainedIn:[self.searchBar class], nil] setTitle:@""];
[[UIBarButtonItem appearanceWhenContainedIn:[self.searchBar class], nil] setImage:[UIImage imageNamed:@"search"]];