前言

之前要做一个类似微博那样输入邮箱登录时出现相关联的邮箱后缀提示，就是下面这种效果。

textFieldResult.gif

没找到很好用的第三方库，只能自己写一个，花费了不少时间，现在贡献出来，希望能够帮到大家。

具体实现

首先，实现邮箱下拉提示这个效果思路还是比较简单明确的，就是一个监听textField的状态，每当用户输入或删除文字时做出判断，如果里面含有“@”，就显示一个tableView，并用NSPredicate过滤显示相关后缀，但具体实现封装时还是费了一番功夫。
首先自定义一个UITextField的子类，将下拉提示的tableView作为它的一个属性，并且用这个TextField作为tableView的代理对象

.h文件
@interface AZXEmailTextField : UITextField
.m文件
@interface AZXEmailTextField ()<UITableViewDataSource, UITableViewDelegate>
// 邮箱下拉提示列表
@property (strong, nonatomic) UITableView *promptTableView;

先把最重要的初始化方法写好，这里因为考虑到大家要面临不同的情况，所以我让开发者自己决定要把这个TextField加到那个View里面作为其超类，当然frame这个参数也是在那个View中的frame，至于setUpInView这个方法有点长我就不在这里贴出来了，大家对具体实现感兴趣的可以把源码下载下来看一下

- (instancetype)initWithFrame:(CGRect)frame InView:(UIView *)view {
    if (self = [super initWithFrame:frame]) {
        return [self setUpInView:view];
    }
    return nil;
}

然后就是要监听用户的改变textField文字的动作了，这里有两种方法，可以用UITextField的代理方法，但是为了能把这个类尽量封装的简单点，我使用的是另一种方法，直接监听其状态的改变(注意，这里的self就是我自定义的那个AZXEmailTextField)

[self addTarget:self action:@selector(textFieldDidChanged) forControlEvents:UIControlEventEditingChanged];

下面就是实现提示相关后缀的功能了，首先判断，只要用户已输入“@”字符，就将下拉列表显示出来(默认是hidden的)，然后使用NSArray的filteredArrayUsingPredicate方法，过滤出匹配用户输入邮箱的提示

- (void)textFieldDidChanged {
    if ([self.text containsString:@"@"]) {
        self.promptTableView.hidden = NO;
        // @后面的subString
        NSString *latterStr = [self.text substringFromIndex:[self.text rangeOfString:@"@"].location+1];
        if ([latterStr isEqualToString:@""]) {
            self.matchedSuffixArray = self.emailSuffixArray;
        } else {
            self.matchedSuffixArray = [self.emailSuffixArray filteredArrayUsingPredicate:[NSPredicate predicateWithFormat:@"self beginswith %@", [self deleteSpacesInString:latterStr]]];
            if (self.matchedSuffixArray.count == 0) {
                self.promptTableView.hidden = YES;
            }
        }
        
        [self.promptTableView reloadData];
    } else {
        self.promptTableView.hidden = YES;
    }
}

再然后，就是显示下拉邮箱列表的具体样式了，考虑到大家具体的需求可能都不一样，我留下许多API供大家高度的自定义下拉样式，比如下拉列表的高度，邮箱后缀的内容，文字离列表左边的距离，文字的字体大小颜色，分割线的左右距离等等。如果想要上图中的默认样式效果，那只要简单的一句代码就搞定了，然后把它加到你想加的View里，剩余的都不用你操心！

AZXEmailTextField *textField = [[AZXEmailTextField alloc] initWithFrame:frame InView:self.view];

源代码在https://github.com/XinStar1/AZXEmailTextField
下载下来之后直接把“邮箱下拉提示”那个文件夹拖到项目里就可以了，这个demo是我认真花费了精力去写的，希望可以帮到大家。如果觉得好用的话，可以给我一个star，当做对我的鼓励！