iOS-关于UISearchController和UISearchBar的应用

UISearchController是iOS 8 之后推出的一个新的控件, 用于创建搜索条, 及管理搜索事件, 使用这个, 我们可以很容易的创建属于自己的搜索框。

一. 基本使用( 同一个控制器 )

UISearchController一般是和UITableView结合使用, 很少会单独使用他, 而且使用UITableView 来展示数据, 也是最佳的选择。

他的API十分简单:

// 初始化方法, 参数是展示搜索结果的控制器, 如果是在当前控制器展示搜索结果, 就传nil
- (instancetype)initWithSearchResultsController:(nullable UIViewController *)searchResultsController;

// 负责更新搜索结果的代理, 需要遵循 UISearchResultsUpdating 协议
@property (nullable, nonatomic, weak) id <UISearchResultsUpdating> searchResultsUpdater;

// 搜索控制器是否是活跃状态, 当在一个控制器展示搜索结果的时候, 可以此来判断返回的数据源
@property (nonatomic, assign, getter = isActive) BOOL active;
// 控制器代理  遵循 UISearchControllerDelegate协议
@property (nullable, nonatomic, weak) id <UISearchControllerDelegate> delegate;
// 当搜索框激活时, 是否添加一个透明视图
@property (nonatomic, assign) BOOL dimsBackgroundDuringPresentation __TVOS_PROHIBITED;
@property (nonatomic, assign) BOOL obscuresBackgroundDuringPresentation NS_AVAILABLE_IOS(9_1); // default is YES
// 当搜索框激活时, 是否隐藏导航条
@property (nonatomic, assign) BOOL hidesNavigationBarDuringPresentation;     // default is YES

@property (nullable, nonatomic, strong, readonly) UIViewController *searchResultsController;
@property (nonatomic, strong, readonly) UISearchBar *searchBar;

PS : 需要注意的是, UISearchController在使用的时候, 需要设置为全局的变量或者控制器属性, 使其生命周期与控制器相同; 如果设置为局部变量, 会提前销毁, 导致无法使用。

我们先声明一些属性:

@property (nonatomic, strong) UITableView *tableView;
@property (nonatomic, strong) UISearchController *searchController;
// 数据源数组
@property (nonatomic, strong) NSMutableArray *datas;
// 搜索结果数组
@property (nonatomic, strong) NSMutableArray *results;

初始化相关属性:

- (UITableView *)tableView {
if (_tableView == nil) {
_tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain];
_tableView.delegate = self;
_tableView.dataSource = self;
[self.view addSubview:_tableView];
}

return _tableView;
}

- (NSMutableArray *)datas {
if (_datas == nil) {
_datas = [NSMutableArray arrayWithCapacity:0];
}

return _datas;
}

- (NSMutableArray *)results {
if (_results == nil) {
_results = [NSMutableArray arrayWithCapacity:0];
}

return _results;
}

然后, 实现tableView和searchController的一些协议, 及其方法:

<UITableViewDelegate, UITableViewDataSource, UISearchResultsUpdating>

创建UISearchController:

// 创建UISearchController, 这里使用当前控制器来展示结果
UISearchController *search = [[UISearchController alloc]initWithSearchResultsController:nil];
// 设置结果更新代理
search.searchResultsUpdater = self;
// 因为在当前控制器展示结果, 所以不需要这个透明视图
search.dimsBackgroundDuringPresentation = NO;
self.searchController = search;
// 将searchBar赋值给tableView的tableHeaderView
self.tableView.tableHeaderView = search.searchBar;

实现tableView的数据源及代理方法:

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

// 这里通过searchController的active属性来区分展示数据源是哪个
if (self.searchController.active) {

return self.results.count ;
}

return self.datas.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
if (cell == nil) {
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cellID"];
}

// 这里通过searchController的active属性来区分展示数据源是哪个
if (self.searchController.active ) {

cell.textLabel.text = [self.results objectAtIndex:indexPath.row];
} else {

cell.textLabel.text = [self.datas objectAtIndex:indexPath.row];
}

return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

if (self.searchController.active) {
NSLog(@"选择了搜索结果中的%@", [self.results objectAtIndex:indexPath.row]);
} else {

NSLog(@"选择了列表中的%@", [self.datas objectAtIndex:indexPath.row]);
}

}

最后实现UISearchController的协议UISearchResultsUpdating方法:

#pragma mark - UISearchResultsUpdating
- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {

NSString *inputStr = searchController.searchBar.text ;
if (self.results.count > 0) {
[self.results removeAllObjects];
}
for (NSString *str in self.datas) {

if ([str.lowercaseString rangeOfString:inputStr.lowercaseString].location != NSNotFound) {

[self.results addObject:str];
}
}

[self.tableView reloadData];
}

这里我只是简单的过滤了一遍数据源, 把数据源中包含输入字符的内容, 添加到搜索结果的数组results中, 然后刷新表格来展示搜索结果:需要注意的是 : 这里当搜索框激活时, 隐藏导航的动画, 这是在和系统导航结合使用, 并且searchController的属性hidesNavigationBarDuringPresentation为 YES的情况下, 才会有的动画效果, 如果使用了自定义的导航, 那就没有这个效果了, 但是我们可以在searchBar的代理方法里, 设置相关的动画效果, 但是整体还是没有系统动画自然。

剩下的就是怎么来处理导航条的问题, 这时候就用到了searchBar的代理方法:

#pragma mark - UISearchBarDelegate
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {

}
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {

}

我这里, 主要是在上面的这两个代理方法里处理的, 具体的实现如下:

- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {

CGRect barFrame = self.customNavBar.frame;
// 移动到屏幕上方
barFrame.origin.y = - 64;

// 调整tableView的frame为全屏
CGRect tableFrame = self.tableView.frame;
tableFrame.origin.y = 20;
tableFrame.size.height = self.view.frame.size.height -20;
这里Y坐标从20开始, 是因为, searchBar的背景视图会多出20的高度, 而tableView的tableHeaderView并没有相应增加, 所以这里强制空出20像素, 防止searchBar遮挡cell

self.customNavBar.frame = barFrame;
self.tableView.frame = tableFrame;
[UIView animateWithDuration:0.4 animations:^{

[self.view layoutIfNeeded];
[self.tableView layoutIfNeeded];
}];
}
- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar {

return YES;
}

- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {

CGRect barFrame = self.customNavBar.frame;
// 恢复
barFrame.origin.y = 0;

// 调整tableView的frame为全屏
CGRect tableFrame = self.tableView.frame;
tableFrame.origin.y = 64;
tableFrame.size.height = self.view.frame.size.height - 64;

[UIView animateWithDuration:0.4 animations:^{

self.customNavBar.frame = barFrame;
self.tableView.frame = tableFrame;
}];
}

注意⚠️：在cell上进行删除等操作时需要UIAlertController弹出，如果searchbar处于编辑状态可能就失效了，不能弹出UIAlertController，而且会报错：

Warning: Attempt to present <UIAlertController: 0x7fbb9c90a400>  on <SearchViewController: 0x7fbb9c551e60> which is already presenting (null)

解决办法：

if (self.isEdit == NO) {
[self presentViewController:alert animated:YES completion:nil];
}else{
[_searchController presentViewController:alert animated:YES completion:nil];
}

如果在当前控制器时建议使用UISearchBar，既简单又可以实现相同的效果。

- (UISearchBar *)searchBar
{
if (!_searchBar) {
_searchBar = [[UISearchBar alloc] initWithFrame: CGRectMake(0, 0, KWindows.width, 44)];
_searchBar.delegate = self;
_searchBar.tintColor = [Common colorWithHexString:MAIN_COLOR];
_searchBar.placeholder = @"用户名";
}
return _searchBar;
}

二. 使用单独的控制器来展示搜索结果

以上搜索结果的展示都是在一个控制器里进行的, 使用searchController的active属性来区分数据源; 我们还可以使用两个控制器来进行, 一个展示原始数据, 一个来展示搜索的结果;

这其实只是在初始化searchController的时候有些区别, 然后两个控制器分别管理自己的数据源即可, 这里直接给出代码:

初始化:

// 创建用于展示搜索结果的控制器
OKResultDisplayController *result = [[OKResultDisplayController alloc]init];
// 创建搜索框
UISearchController *search = [[UISearchController alloc]initWithSearchResultsController:result];

self.tableView.tableHeaderView = search.searchBar;

search.searchResultsUpdater = result;

self.searchController = search;

然后在 OKResultDisplayController.h 遵循协议UISearchResultsUpdating :

@interface LZResultDisplayController : UIViewController<UISearchResultsUpdating>

@end

实现协议方法:

#pragma mark - UISearchResultsUpdating
- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {

// 这里处理过滤数据源的逻辑
NSString *inputStr = searchController.searchBar.text ;
if (self.results.count > 0) {
[self.results removeAllObjects];
}
for (NSString *str in self.datas) {

if ([str.lowercaseString rangeOfString:inputStr.lowercaseString].location != NSNotFound) {

[self.results addObject:str];
}
}
// 然后刷新表格
[self.tableView reloadData];
}

本文引用，关于searchBar的相关设置, 可参考笔者的另一篇文章[iOS]关于UISearchBar, 看这个就够了;