当前位置: 首页 > 编程笔记 >

iOS 使用UITextField自定义搜索框 实现用户输入完之后“实时搜索”功能

江坚成
2023-03-14
本文向大家介绍iOS 使用UITextField自定义搜索框 实现用户输入完之后“实时搜索”功能,包括了iOS 使用UITextField自定义搜索框 实现用户输入完之后“实时搜索”功能的使用技巧和注意事项,需要的朋友参考一下

注:CSDN的代码块有点捞,如果浏览器窗口较窄,一行代码占了两行的位置,后面的代码就看不到了,大家可以把浏览器窗口拉大一点

UI小姐姐设计的搜索框经常是五花八门,系统的搜索框经常不能满足我们的需求,需要我们特别定制一个。但是UITextField的诸多回调里面,没有一个是适合触发搜索时间的。
UITextFieldTextDidChangeNotification调用过于频繁,每输入一个字符就调一次接口怕是不太合适。
UITextFieldTextDidEndEditingNotification只有在结束编辑的时候才会调一次,结束编辑就意味着键盘消失了,也不太合适。
这样就难倒我们了吗,当然不是,办法还是有滴。

解决方案

先自定义一个搜索框 改好样式,然后监听UITextFieldTextDidChangeNotification

- (void)textFieldDidChange{
 if (self.searchDelegate && [self.searchDelegate respondsToSelector:@selector(customSearchBar:textDidChange:)]) {
 [self.searchDelegate customSearchBar:self textDidChange:self.text];
 }
}

使用

@property (nonatomic, strong) LGCustomSearchBar *searchBar;
@property (nonatomic, assign) NSInteger inputCount; 记录输入次数

- (void)viewDidLoad {
 [super viewDidLoad];
 self.searchBar = [[LGCustomSearchBar alloc] initWithFrame:CGRectMake(20, 10, kScreenWidth-40, 36)];
 self.searchBar.searchDelegate = self;
 [self.view addSubview:self.searchBar];
}
- (void)customSearchBar:(LGCustomSearchBar *)searchBar textDidChange:(NSString *)searchText{
 if (searchText.length == 0) {
 [self searchKeyword:@(self.inputCount)];
 }
 else{
 self.inputCount++;
 [self performSelector:@selector(searchKeyword:) withObject:@(self.inputCount) afterDelay:1.5f];
 }
}
- (void)searchKeyword:(NSNumber *)inputCount{
	// 判断不等于0是为了防止用户输入完直接点击搜索,延时结束之后又搜索一次
 if (inputCount.integerValue == self.inputCount && self.inputCount != 0) {
 [self loadData];
 }
}
- (BOOL)textFieldShouldReturn:(UITextField *)textField{
 [self loadData];
 return NO;
}
- (void)loadData{
 self.inputCount = 0;
	// 本地查询 或者 请求数据
	...
 [self.tableView reloadData];
}

核心代码

延迟1.5秒以后执行搜索,判读如果1.5秒之后传入的输入次数和现在的输入次数一致,说明用户1.5秒已经没有输入新内容了,加在新数据。这个时间可以自己调整

[self performSelector:@selector(searchKeyword:) withObject:@(self.inputCount) 
afterDelay:1.5f];

总结

到此这篇关于iOS 使用UITextField自定义搜索框 实现用户输入完之后“实时搜索”功能的文章就介绍到这了,更多相关ios UITextField自定义搜索框 实时搜索内容请搜索小牛知识库以前的文章或继续浏览下面的相关文章希望大家以后多多支持小牛知识库!

 类似资料:
  • 本文向大家介绍自定义搜索功能Android实现,包括了自定义搜索功能Android实现的使用技巧和注意事项,需要的朋友参考一下 先看看效果图: 源码下载:自定义搜索功能 代码: SearchActivity.java SearchBean.java SearchAdapter.java CommonAdapter.java ViewHolder.java SearchView.java 布局文件:

  • 问题内容: 我通过了几个链接,以找到在ios应用程序中实现google customsearchapi的正确步骤,并在此过程中花费了大约6到7个小时。 链接: https://developers.google.com/custom-search/json-api/v1/简介 http://developers.google.com/apis-explorer/#p/customsearch/v1

  • 本文向大家介绍JavaScript实现搜索框的自动完成功能(一),包括了JavaScript实现搜索框的自动完成功能(一)的使用技巧和注意事项,需要的朋友参考一下 在很多需要搜索的网站, 都会有一个自动完成的搜索框. 方便用户查找他们想要的搜索词. 帮助用户快速找到自己想要的结果. 这种方式是比较友好的. 所以是比较提倡使用的. 先给大家展示下效果图:   实现这个功能需要服务端配合。客户端通过脚

  • 本文向大家介绍jquery中用jsonp实现搜索框功能,包括了jquery中用jsonp实现搜索框功能的使用技巧和注意事项,需要的朋友参考一下 前面的话:     在上周本来想发一篇模仿必应搜索的界面。但是在准备写文章之前突然想到前面学习了ajax技术,在这里我也让我的页面有一种不需要手动刷新就能获取到数据。但是发现用前面的方法并不能获取到我想要的效果。无奈前几天电脑换系统,把之前的源码丢了(前面

  • 本文向大家介绍自动完成的搜索框javascript实现,包括了自动完成的搜索框javascript实现的使用技巧和注意事项,需要的朋友参考一下 在很多需要搜索的网站, 都会有一个自动完成的搜索框. 方便用户查找他们想要的搜索词. 帮助用户快速找到自己想要的结果. 这种方式是比较友好的. 所以是比较提倡使用的. 我们这次就来实现这一效果. 我们通过两篇文章来进行讲解. 首先我们来完成界面的设计布局.

  • 本文向大家介绍JS仿淘宝搜索框用户输入事件的实现,包括了JS仿淘宝搜索框用户输入事件的实现的使用技巧和注意事项,需要的朋友参考一下 淘宝是我们经常用的一个网上购物平台,打开淘宝网首页,找到淘宝首页的搜索框,如下如所示: 大家可以看到,当页面一打开,搜索框中就可以看到灰色字体“少女高跟鞋”,还有闪烁的光标。当用户点击输入的时候,灰色字消失。当用户清空文本框的所有内容的时候,灰色字自动恢复。 接下来,