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自定义搜索框 实时搜索内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • iOS中Swift UISearchController仿微信搜索框

    iOS中Swift UISearchController仿微信搜索框

    创建一个UISearchController 如果传入的searchResultsController为nil,则表示搜索的结果在当前控制器中显示,现在我让它在searchResultVC中显示 // 创建searchResultVC let searchResultVC = UIViewController() // 设置背景颜色为红色 searchResultVC.view.backgroundColor = UIColor.red let searchController = UISear

  • iOS UITextField最大字符数和字节数的限制详解

    iOS UITextField最大字符数和字节数的限制详解

    前言 这里我给大家几组测试用例可以一试,为啥不好用. 1.限制10个字节,输入2个Emoj之后是8个字节(一个Emoj是4个字节),此时再输入一个中文,看看结果如何(中文的UTF8占3个字节) 2.限制5个字符,一个Emoj是2个字符,其他都是一个.此时输入两个Emoj,再输入中文,然后中文联想试试. 就目前的情况来说,看了很多资料,并没有一个通用的能限制字符数和字节数的封装.这里全面进行了总结,并进行了封装.欢迎大家下载. 一. 字符限制 1. 错误方法 常见的这种方法是错误的,会导致Emoj

  • iOS输入框(UITextField)密码明暗文切换方法

    在做明暗文切换(密码输入框)的时候遇见一个坑,就是切换secureTextEntry的时候,输入框的光标会偏移,下面列出了一个解决办法及一种明暗文切换的方法 - (IBAction)pwdTextSwitch:(UIButton *)sender { // 前提:在xib中设置按钮的默认与选中状态的背景图 // 切换按钮的状态 sender.selected = !sender.selected; if (sender.selected) { // 按下去了就是明文 NSString *temp

  • iOS改变UITextField占位文字颜色的三种方法

    iOS改变UITextField占位文字颜色的三种方法

    有时,UITextField自带的占位文字的颜色太浅或者不满足需求,所以需要修改,而UITextField没有直接的属性去修改占位文字的颜色,所以只能通过其他间接方式去修改. 例如:系统默认的占位文字颜色太浅 需要加深颜色,或者改变颜色 示例: 核心代码 方法一:通过attributedPlaceholder属性修改占位文字颜色 CGFloat viewWidth = self.view.bounds.size.width; CGFloat textFieldX = 50; CGFloat te

  • IOS改变UISearchBar中搜索框的高度

    IOS改变UISearchBar中搜索框的高度

    一.系统的searchBar 1.UISearchBar的中子控件及其布局 UIView(直接子控件) frame 等于 searchBar的bounds,view的子控件及其布局 UISearchBarBackground(间接子控件) frame 等于searchBar的bounds UISearchBarTextField(间接子控件) frame.origin等于(8.0, 6.0),即不等于searchBar的bounds 2.改变searchBar的frame只会影响其中搜索框的宽度

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

    注:CSDN的代码块有点捞,如果浏览器窗口较窄,一行代码占了两行的位置,后面的代码就看不到了,大家可以把浏览器窗口拉大一点 UI小姐姐设计的搜索框经常是五花八门,系统的搜索框经常不能满足我们的需求,需要我们特别定制一个.但是UITextField的诸多回调里面,没有一个是适合触发搜索时间的. UITextFieldTextDidChangeNotification调用过于频繁,每输入一个字符就调一次接口怕是不太合适. UITextFieldTextDidEndEditingNotificatio

  • 微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能)

    上效果图: 一:搜索框功能实现 1.在首页做一个搜索框的样式并实现跳转到搜索页面 <view class='page_row' bindtap="suo"> <view class="search"> <view class="df search_arr"> <icon class="searchcion" size='20' type='search'></icon>

  • .NET+JS对用户输入内容进行字数提示功能的实例代码

    第一步:以下是核心代码,在页面引用或进行封装都可. 复制代码 代码如下: <script language="javascript" type="text/javascript"> function textLimitCheck(thisArea, maxLength, SpanId) { if (thisArea.value.length > maxLength) { thisArea.value = thisArea.value.substri

  • Flutter实现自定义搜索框AppBar的示例代码

    Flutter实现自定义搜索框AppBar的示例代码

    目录 介绍 效果图 实现步骤 完整源码 总结 介绍 开发中,页面头部为搜索样式的设计非常常见,为了可以像系统AppBar那样使用,这篇文章记录下在Flutter中自定义一个通用的搜索框AppBar记录. 功能点: 搜索框.返回键.清除搜索内容功能.键盘处理. 效果图 实现步骤 首先我们先来看下AppBar的源码,实现了PreferredSizeWidget类,我们可以知道这个类主要是控制AppBar的高度的,Scaffold脚手架里的AppBar的参数类型就是PreferredSizeWidge

  • 微信小程序实现搜索框功能及踩过的坑

    先上代码: wxml: <!-- 顶部搜索框 --> <view class="inputcontainer"> <view class="input" catchtap="inputSwitchStatus" wx:if="{{!edit}}">搜索商品</view> <view class="edit" wx:else> <form bi

  • 自动完成的搜索框javascript实现

    自动完成的搜索框javascript实现

    在很多需要搜索的网站, 都会有一个自动完成的搜索框. 方便用户查找他们想要的搜索词. 帮助用户快速找到自己想要的结果. 这种方式是比较友好的. 所以是比较提倡使用的. 我们这次就来实现这一效果. 我们通过两篇文章来进行讲解. 首先我们来完成界面的设计布局. 界面的HTML结构, 第一个少不了的是一个搜索框, 第二个就是搜索的点击按钮. <div class="search"> <input type="text" value=""

  • JavaScript实现搜索框的自动完成功能(一)

    在很多需要搜索的网站, 都会有一个自动完成的搜索框. 方便用户查找他们想要的搜索词. 帮助用户快速找到自己想要的结果. 这种方式是比较友好的. 所以是比较提倡使用的. 先给大家展示下效果图: 实现这个功能需要服务端配合.客户端通过脚本来展示从服务端取得的数据. 先看客户端的HTML: 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DT

  • php 搜索框提示(自动完成)实例代码

    php 搜索框提示(自动完成)实例代码

    百度的搜索大家都在用,当用户输入文字时,搜索框下面自动提示相关的信息,加强了用户体验,的确不错,那么这个效果是如何实现的呢 先看一下效果图吧,这样更有动力,要不然大家还不知道我在讲什么,到底要达到什么样的效果! 下面先主要讲解原理: 在search.html页面中,用户在搜索框内输入"j"时,使用javascript获取搜索框的文本内容,到数据库中查找相关的内容并返回,再使用javascript将服务器返回的结果显示在搜索框下面的提示框内,供用户参考选择. 具体的实现方法: 首先在页面

  • Jquery Easyui搜索框组件SearchBox使用详解（19）

    Jquery Easyui搜索框组件SearchBox使用详解（19）

    本文实例为大家分享了Jquery Easyui搜索框组件的实现代码,供大家参考,具体内容如下 加载方式 Class加载 <input id="ss" class="easyui-searchbox" style="width:300px" data-options="prompt:'Please Input Value',menu:'#box'"> </input> <div id="b

  • jquery+php实现搜索框自动提示

    今天突然想给本站做个搜索页面,这样用户可以通过搜索来找到自己喜欢的内容,也避免了在海量信息中手动查找资源的麻烦,我的目标和百度首页的效果类似,当用户输入要搜索的文字时,我们在下方给出相关的十条信息,如果用户要找的就是这十条信息内的某一条,那么简单,直接点击就可在新页面中打开页面,主要就是想更人性化一点,让用户使用起来更方便. 先看一下效果图吧,这样更有动力,要不然大家还不知道我在讲什么,到底要达到什么样的效果! jquery+php实现搜索框自动提示 下面先主要讲解原理: 在search.htm

随机推荐