前几天的项目里要做个小效果:类似新浪微博那样输入邮箱登录时出现关联的邮箱后缀下拉提示,如下:
(上边下拉列表实际是textfiled+tableView,已经封装成小控件,根据项目需求,稍作调整即可直接集成到项目里。简单易用,一句代码搞定)
这种效果实现不难,网上貌似也没好用的控件。把自己写的贡献出来。大家如果有其他想法,欢迎留言,或者在github里issues。
下载地址:/mythkiven/JPullEmailTF
代码简单易懂,简单描述下实现:
就思路来说,就是一个监听textField的状态,每当textField.text变化时做出判断,如果里面含有“@”,就显示一个tableView,并用NSPredicate过滤显示相关后缀。
1、定义一个UITextField的子类:JPullEmailTF,将下拉提示的tableView作为它的一个属性,并且用这个TextField作为tableView的代理对象:
@interface JPullEmailTF ()<UITableViewDataSource, UITableViewDelegate>
/** 邮箱下拉列表 */
@property (strong, nonatomic) UITableView *pullTableView;
2、监听textField文字的变化:
[selfaddTarget:selfaction:@selector(textFieldDidChanged)forControlEvents:UIControlEventEditingChanged];
3、核心实现:只要用户输入“@”字符,就将下拉列表显示出来,然后使用NSArray的filteredArrayUsingPredicate方法,过滤出匹配用户输入邮箱的列表
- (void)textFieldDidChanged {
if ([self.text containsString:@"@"]) {
self.pullTableView.hidden = NO;
NSString *latterStr = [self.text substringFromIndex:[self.text rangeOfString:@"@"].location+1];
if ([latterStr isEqualToString:@""]) {
self.matchedSuffixArray = self.mailsuffixData;
} else {
self.matchedSuffixArray = [self.mailsuffixData filteredArrayUsingPredicate:[NSPredicate predicateWithFormat:@"self beginswith %@", [self deleteSpacesInString:latterStr]]];
if (self.matchedSuffixArray.count == 0) {
self.pullTableView.hidden = YES;
}
}
[self.pullTableView reloadData];
} else {
self.pullTableView.hidden = YES;
}
}
4、剩下就是现实列表了,由于不同的UI场景,需求各不相同,所以大家可以下载下来按照自己的需求进一步开发。或者直接使用默认样式,一句话集成:
JPullEmailTF *textField = [[JPullEmailTF alloc] initWithFrame:self.holderView.frame InView:self.view];
源代码在/mythkiven/JPullEmailTF
5、下载下来之后直接把“JPullEmailTF”那个文件夹拖到项目里,就OK了。
PS:这个demo是我认真写的,希望可以帮到大家。如果觉得好用的话,可以给我一个star,当做对我的鼓励!