当前位置:首页 > 移动端 > iOS开发-搜索栏UISearchBar和UISearchController

iOS开发-搜索栏UISearchBar和UISearchController

2022年08月05日 09:15:43移动端4

iOS中UISearchDisplayController用于搜索,搜索栏的重要性我们就不说了,狼厂就是靠搜索起家的,现在越来越像一匹没有节操的狼,UC浏览器搜索栏现在默认自家的神马搜索,现在不管是社交,O2O还是在线教育等都会有一个搜索栏的实现,不过彼此实现效果是不一样的。iOS中的搜索栏实现起来相对简单一点,网上也有很多参考资料,不过靠谱的不是很多,很多都是iOS 8.0之前的实现,iOS 8.0上的实现貌似很少看到,可以运行,不过会看到searchDisplayController' is deprecated: first deprecated in iOS 8.0警告,看了一些老外的代码,使用了一下UISearchController感觉还是非常不错的。

UISearchBar和UISearchDisplayController

是网上最常见的也算是最简单的,也有使用Searh Bar Search Display Controller的控件的,本文就简单的使用Search Bar和UITableView实现搜索Demo的,最上面的就是搜索栏,之前的就是TableView:

iOS开发-搜索栏UISearchBar和UISearchController _ JavaClub全栈架构师技术笔记

为了实现搜索需要声明委托UISearchBarDelegate,UISearchDisplayDelegate,其中搜索主要使用的就是UISearchDisplayDelegate,具体代码实现过程:

声明字段:

@property (strong,nonatomic) NSMutableArray  *dataList;

@property (strong,nonatomic) NSMutableArray  *searchList;

 初始化数据:

  self.dataList=[NSMutableArray arrayWithCapacity:100];
    
    for (NSInteger i=0; i<100; i++) {
        [self.dataList addObject:[NSString stringWithFormat:@"%ld-FlyElephant",(long)i]];
    }

 设置区域:

//设置区域
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 1;
}

 设置区域的行数(重点),这个就是使用委托之后需要需要判断是一下是否是需要使用Search之后的视图:

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
        if (tableView == self.searchDisplayController.searchResultsTableView) {
            return [self.searchList count];
        }else{
            return [self.dataList count];
    }
}

 同样的返回单元格也有两种情况,一种是初始化数据,一种是过滤之后的数据视图:

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *flag=@"cellFlag";
    UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:flag];
    if (cell==nil) {
        cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:flag];
    }
    if (tableView==self.searchDisplayController.searchResultsTableView) {
        [cell.textLabel setText:self.searchList[indexPath.row]];
    }
    else{
        [cell.textLabel setText:self.dataList[indexPath.row]];
    }

    return cell;
}

 UISearchBarDelegate中的开始和结束的事件:

- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar{
    NSLog(@"搜索Begin");
    return YES;
}

- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar{
    NSLog(@"搜索End");
    return YES;
}

搜索时过滤数据:

- (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString{
    // 谓词的包含语法,之前文章介绍过http://www.cnblogs.com/xiaofeixiang/
    NSPredicate *preicate = [NSPredicate predicateWithFormat:@"SELF CONTAINS[c] %@", searchString];
    
    if (self.searchList!= nil) {
        [self.searchList removeAllObjects];
    }
    //过滤数据
    self.searchList= [NSMutableArray arrayWithArray:[_dataList filteredArrayUsingPredicate:preicate]];
    //刷新表格
    return YES;
}

 最终效果如下:

iOS开发-搜索栏UISearchBar和UISearchController _ JavaClub全栈架构师技术笔记

UISearchController实现搜索

UISeachBar通过UISearchDisplayDelegate实现上面的效果是没有问题的,网上也有很多类似的实现效果,不过是警告的,信息如下: 'searchDisplayController' is deprecated: first deprecated in iOS 8.0,这么明显一个警告总不能视而不见吧StackOverFlow中发现UISearchDisplayController is deprecated in IOS8.0, and recommended to use UISearchController instead,也就是说iOS 8.0不推荐UISearchDisplayController,也就是不推荐使用UISearchDisplayDelegate,但是可以通过UISearchController实现UISearchResultsUpdating这个委托实现上面的效果;

视图中中需要声明UISearchResultsUpdating:

@interface ViewController : UITableViewController<UITableViewDelegate,UITableViewDataSource,UISearchBarDelegate,UISearchResultsUpdating>


@end

 属性声明:

@property (nonatomic, strong) UISearchController *searchController;

 需要自己初始化一下UISearchController:

    _searchController = [[UISearchController alloc] initWithSearchResultsController:nil];
    
    _searchController.searchResultsUpdater = self;
    
    _searchController.dimsBackgroundDuringPresentation = NO;
    
    _searchController.hidesNavigationBarDuringPresentation = NO;
    
    _searchController.searchBar.frame = CGRectMake(self.searchController.searchBar.frame.origin.x, self.searchController.searchBar.frame.origin.y, self.searchController.searchBar.frame.size.width, 44.0);
    
    self.tableView.tableHeaderView = self.searchController.searchBar;

 之前是通过判断搜索时候的TableView,不过现在直接使用self.searchController.active进行判断即可,也就是UISearchController的active属性:

//设置区域的行数
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    
            if (self.searchController.active) {
                return [self.searchList count];
            }else{
                return [self.dataList count];
            }
    
}

//返回单元格内容
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *flag=@"cellFlag";
    UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:flag];
    if (cell==nil) {
        cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:flag];
    }
    if (self.searchController.active) {
        [cell.textLabel setText:self.searchList[indexPath.row]];
    }
    else{
        [cell.textLabel setText:self.dataList[indexPath.row]];
    }
    return cell;
}

 具体调用的时候使用的方法也发生了改变,这个时候使用updateSearchResultsForSearchController进行结果过滤:

-(void)updateSearchResultsForSearchController:(UISearchController *)searchController {
    
    NSString *searchString = [self.searchController.searchBar text];
    
    NSPredicate *preicate = [NSPredicate predicateWithFormat:@"SELF CONTAINS[c] %@", searchString];
    
    if (self.searchList!= nil) {
        [self.searchList removeAllObjects];
    }
    //过滤数据
    self.searchList= [NSMutableArray arrayWithArray:[_dataList filteredArrayUsingPredicate:preicate]];
    //刷新表格

    [self.tableView reloadData];
}

 效果演示:

iOS开发-搜索栏UISearchBar和UISearchController _ JavaClub全栈架构师技术笔记

 

 不过两者最终实现的效果的效果基本上是一致,殊途同归,本文难免有所遗漏,如有不当,请多多指正~

参考资料:

https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UISearchController/index.html#//apple_ref/occ/instp/UISearchController/searchBar

 

2016.05.10 补充 

如果需要设置搜索的文字可以通过searchBar设置:

searchController.searchBar.placeholder=@"FlyElephant最新博客-http://www.jianshu.com/users/24da48b2ddb3/latest_articles";

 

作者:Fly_Elephant
来源链接:https://www.cnblogs.com/xiaofeixiang/p/4273620.html

版权声明:
1、JavaClub(https://www.javaclub.cn)以学习交流为目的,由作者投稿、网友推荐和小编整理收藏优秀的IT技术及相关内容,包括但不限于文字、图片、音频、视频、软件、程序等,其均来自互联网,本站不享有版权,版权归原作者所有。

2、本站提供的内容仅用于个人学习、研究或欣赏,以及其他非商业性或非盈利性用途,但同时应遵守著作权法及其他相关法律的规定,不得侵犯相关权利人及本网站的合法权利。
3、本网站内容原作者如不愿意在本网站刊登内容,请及时通知本站(javaclubcn@163.com),我们将第一时间核实后及时予以删除。


本文链接:https://www.javaclub.cn/mobile/17600.html

标签: iOS
分享给朋友:

“iOS开发-搜索栏UISearchBar和UISearchController” 的相关文章

如何在MacOS上创建第一个iOS Flutter应用

如何在MacOS上创建第一个iOS Flutter应用

文章目录 1.安装Flutter 2.设置iOS模拟器 3.在Flutter中创建一个Hello World应用 Google于2018年12月4日发布了Flutter 1.0,...

flutter 在windows和linux上运行IOS UI模拟器

之前发视频总是有人留言,我用的什么模拟器,今天给大家说一下 我一般用的是device_preview这个插件,这个插件的闲置是只能做UI上的模拟,并没有真正的运行环境。 近似您的应用程序在另一台设备上的外观和性能。 插件名称 device_p...

Flutter设置App的应用名字和应用logo图标的方法(android ios web)

Flutter设置App的应用名字和应用logo图标的方法(android ios web)

在前面的几期给大家介绍了flutter的安装以及一些简单的配置,还运行了helloword 那么接下来就带领大家了解如何设置应用名称以及图标 Flutter设置App的应用名字和应用logo图标的方法, 知识点虽然简单,但是不知道这个知...

文顶顶iOS开发博客链接整理及部分项目源代码下载

网上的iOS开发的教程很多,但是像cnblogs博主文顶顶的博客这样内容图文并茂,代码齐全,示例经典,原理也有阐述,覆盖面宽广,自成系统的系列教程却很难找。如果你是初学者,在学习了斯坦福iOS7公开课和跟着文顶顶的博客做项目之后,最快只需要2个月时间,就基本可以独立完成iOS App的...

IOS开发之新浪围脖

IOS开发之新浪围脖

  IOS开发和Web开发一样,网络请求方式包括Get和Post方式。Get和Post两者有和特点和区别,在本篇博客中不做过多的论述,本篇的重点在于如何GET数据和POST数据。下面还会提到如何在我们的项目中使用CocoaPods, CocoaPods的安装和使用教程请参考链接http...

iOS开发之使用XMPPFramework实现即时通信(二)

iOS开发之使用XMPPFramework实现即时通信(二)

上篇的博客iOS开发之使用XMPPFramework实现即时通信(一)只是本篇的引子,本篇博客就给之前的微信加上即时通讯的功能,主要是对XMPPFramework的使用。本篇博客中用到了Spark做测试,当然也少不了Openfire服务器,在这就不详述Openfire的安装过程了(网上...

iOS-Runtime知识点整理

iOS-Runtime知识点整理

runtime的5个核心用法:1.获取属性列表2.交换方法实现3.关联对象4.拦截未实现的方法、动态添加实现5.动态创建一个类 本文目录 1.Runtime简介 2.Runtime相关的头文件 3.技术点和应用场...

IOS开发--微信支付

IOS开发--微信支付

前言:下面介绍微信支付的开发流程的细节,图文并茂,你可以按照我的随笔流程过一遍代码。包你也学会了微信支付。而且支付也是面试常问的内容。        正文:   1、首先在开始使用微信支付之前,有一些东西是开发者必须要知道的,打开下面链...

iOS开发支付篇——内购(IAP)详解

iOS开发支付篇——内购(IAP)详解

内购所需要的资料整理总结,史上最完整的,哈哈哈哈哈哈 思维导图 重点总结: 1.获取内购列表(从App内读取或从自己服务器读取) 2.App Store请求可用的内购列表 3.向用户展示内购列表 4.用户选择了...

iOS可视化动态绘制八种排序过程(Swift版)

iOS可视化动态绘制八种排序过程(Swift版)

前面几篇博客都是关于排序的,在之前陆陆续续发布的博客中,我们先后介绍了冒泡排序、选择排序、插入排序、希尔排序、堆排序、归并排序以及快速排序。俗话说的好,做事儿要善始善终,本篇博客就算是对之前那几篇博客的总结了。而本篇博客的示例Demo也是在之前那些博客Demo的基础上做的,也算是集成了...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。