一. 前言
我们在项目开发中很经常会碰到各种对输入框的限制需求,比如姓名最多只能10字符,密码最多只能16个字符,金额最多9位数且小数点只能保留两位小数,且不能包含表情,更有甚者,可能会要求姓名,中文最多6个字符,英文最多12个字符。面对着各种错综复杂输入限制以及不同种类的第三方键盘,处理起来很经常需要写一定量的代码,且处理逻辑相对复杂。基于这样的情况,于是编写了这样一个输入框拦截器:FJFTextInputIntercepter。
FJFTextInputIntercepter拦截器的作用就类似于你请的家政服务,原本你需要自己来打扫家里,但是现在你只需把你的需求告诉家政人员,他们会按照你的需求来进行打扫,最后将打扫结果告知你。输入框拦截器就类似这样的效果,你只需告诉它输入的限制条件,然后他就会将依据你的限制条件进行处理,并将处理结果回调给你。
这个输入框拦截器:FJFTextInputIntercepter使用简单,只需设置限制条件,然后传入需要限制的输入框,其他的就交给拦截器进行处理。
二.使用介绍
使用方法
/** 设置 需要 拦截的输入框 @param textInputView 输入框 */- (void)textInputView:(UIView *)textInputView;/** 设置 拦截器和拦截的输入框 @param textInputView 输入框 @param intercepter 拦截器 */+ (void)textInputView:(UIView *)textInputView setInputIntercepter:(FJFTextInputIntercepter *)intercepter;/** 生成 输入框 拦截器 @param textInputView 需要限制的输入框 @param beyoudLimitBlock 超过限制 回调 @return 生成 输入框 拦截器 */+ (FJFTextInputIntercepter *)textInputView:(UIView *)textInputView beyoudLimitBlock:(FJFTextInputIntercepterBlock)beyoudLimitBlock;
举个例子:金额输入限制:最多9位数,最多保留2位小数。
// moneyTextFieldView- (FJTextFieldView *)moneyTextFieldView { if (!_moneyTextFieldView) {
_moneyTextFieldView = [[FJTextFieldView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(self.cardTextFieldView.frame) + 20, [UIScreen mainScreen].bounds.size.width - 80 - 20, 44)];
_moneyTextFieldView.tipLabel.text = @"金额:";
_moneyTextFieldView.textField.placeholder = @"请输入金额(最多9位数,保留2位小数)";
FJFTextInputIntercepter *intercepter = [[FJFTextInputIntercepter alloc] init]; // 最多输入9位数
intercepter.maxCharacterNum = 9; // 保留两位小数
intercepter.decimalPlaces = 2; // 分数类型
intercepter.intercepterNumberType = FJFTextInputIntercepterNumberTypeDecimal;
intercepter.beyoudLimitBlock = ^(FJFTextInputIntercepter *textInputIntercepter, NSString *string) { NSLog(@"最多只能输入9位数字");
};
[intercepter textInputView:_moneyTextFieldView.textField];
} return _moneyTextFieldView;
}如上我们可以看到:
我们生成了一个FJFTextInputIntercepter拦截器实例,然后给实例的属性分别添加限制要求,最后将限制的输入框传入拦截器,表示对此输入框依据限制要求进行输入拦截。
集成方法:
静态:手动将FJFTextInputIntercepter文件夹拖入到工程中。 动态:CocoaPods:pod 'FJFTextInputIntercepter'
github 链接
Demo地址: https://github.com/fangjinfeng/FJFTextInputIntercepter
效果展示:

FJFTextInputIntercepter.gif
三. 原理分析
1. 原理简介
FJFTextInputIntercepter只有一种调用方法就是:
首先生成
拦截器实例:
FJFTextInputIntercepter *intercepter = [[FJFTextInputIntercepter alloc] init];
然后给
拦截器实例相关属性设置限制要求:
intercepter.maxCharacterNum = 10;
intercepter.emojiAdmitted = NO;
intercepter.doubleBytePerChineseCharacter = NO;
intercepter.beyoudLimitBlock = ^(FJFTextInputIntercepter *textInputIntercepter, NSString *string) { NSLog(@"最多只能输入汉字5个字,英文10个字母");
};最后设置
拦截对象即需要进行输入限制的输入框:
[intercepter textInputView:_nameTextFieldView.textField];
2. 代码分析:
属性分析:
// maxCharacterNum 限制 最大 字符@property (nonatomic, assign) NSUInteger maxCharacterNum;// decimalPlaces 小数 位数// (当intercepterNumberType 为FJFTextInputIntercepterNumberTypeDecimal 有用)@property (nonatomic, assign) NSUInteger decimalPlaces;// beyoudLimitBlock 超过限制 最大 字符数 回调@property (nonatomic, copy) FJFTextInputIntercepterBlock beyoudLimitBlock;// emojiAdmitted 是否 允许 输入 表情@property (nonatomic, assign, getter=isEmojiAdmitted) BOOL emojiAdmitted;// intercepterNumberType 数字 类型// FJFTextInputIntercepterNumberTypeNone 默认// FJFTextInputIntercepterNumberTypeNumberOnly 只允许 输入 数字,emojiAdmitted,decimalPlaces 不起作用// FJFTextInputIntercepterNumberTypeDecimal 分数 emojiAdmitted 不起作用 decimalPlaces 小数 位数@property (nonatomic, assign) FJFTextInputIntercepterNumberType intercepterNumberType;/** doubleBytePerChineseCharacter 为 NO 字母、数字、汉字都是1个字节 表情是两个字节 doubleBytePerChineseCharacter 为 YES 不允许 输入表情 一个汉字是否代表两个字节 default YES 允许 输入表情 一个汉字代表3个字节 表情 代表 4个字节 */@property (nonatomic, assign, getter=isDoubleBytePerChineseCharacter) BOOL doubleBytePerChineseCharacter;
属性功能如注释所示,拦截器默认设置如下属性:
_emojiAdmitted = NO; _maxCharacterNum = UINT_MAX; _doubleBytePerChineseCharacter = NO; _intercepterNumberType = FJFTextInputIntercepterNumberTypeNone;
默认不允许输入表情、不限制最大输入字符数、汉字和字符同样一个字节、表情两个字节、不设置数字类型。
限制逻辑分析:
A. 调用公共方法:
#pragma mark -------------------------- Public Methods- (void)textInputView:(UIView *)textInputView {
[FJFTextInputIntercepter textInputView:textInputView setInputIntercepter:self];
}
+ (FJFTextInputIntercepter *)textInputView:(UIView *)textInputView beyoudLimitBlock:(FJFTextInputIntercepterBlock)beyoudLimitBlock {
FJFTextInputIntercepter *tmpInputIntercepter = [[FJFTextInputIntercepter alloc] init];
tmpInputIntercepter.beyoudLimitBlock = [beyoudLimitBlock copy];
[self textInputView:textInputView setInputIntercepter:tmpInputIntercepter]; return tmpInputIntercepter;
}
+ (void)textInputView:(UIView *)textInputView setInputIntercepter:(FJFTextInputIntercepter *)intercepter {
if ([textInputView isKindOfClass:[UITextField class]]) { UITextField *textField = (UITextField *)textInputView;
textField.yb_textInputIntercepter = intercepter;
[[NSNotificationCenter defaultCenter] addObserver:intercepter
selector:@selector(textInputDidChangeWithNotification:)
name:UITextFieldTextDidChangeNotification
object:textInputView];
} else if ([textInputView isKindOfClass:[UITextView class]]) { UITextView *textView = (UITextView *)textInputView;
textView.yb_textInputIntercepter = intercepter;
[[NSNotificationCenter defaultCenter] addObserver:intercepter
selector:@selector(textInputDidChangeWithNotification:)
name:UITextViewTextDidChangeNotification
object:textInputView];
}
}从代码中我们可以看出最后都会走:
+ (void)textInputView:(UIView *)textInputView setInputIntercepter:(FJFTextInputIntercepter *)intercepter
类方法,这里对输入框类型进行了判断,并设置将拦截器和输入框关联在一起,保证拦截器的生命周期和输入框一致,同时注册了文本改变的通知。
B. 文本改变通知:
#pragma mark -------------------------- Noti Methods- (void)textInputDidChangeWithNotification:(NSNotification *)noti { if (![((UIView *)noti.object) isFirstResponder]) { return;
}
BOOL textFieldTextDidChange = [noti.name isEqualToString:UITextFieldTextDidChangeNotification] &&
[noti.object isKindOfClass:[UITextField class]]; BOOL textViewTextDidChange = [noti.name isEqualToString:UITextViewTextDidChangeNotification] &&
[noti.object isKindOfClass:[UITextView class]]; if (!textFieldTextDidChange && !textViewTextDidChange) { return;
}
if ([noti.name isEqualToString:UITextFieldTextDidChangeNotification]) {
[self textFieldTextDidChangeWithNotification:noti];
} else if ([noti.name isEqualToString:UITextViewTextDidChangeNotification]) {
[self textViewTextDidChangeWithNotification:noti];
}
}该函数主要对是否为当前第一响应者和通知名称是否匹配进行判断,然后调用输入框类型对应的通知处理方法。
C. 输入框类型通知处理方法:
#pragma mark -------------------------- Private Methods- (void)textFieldTextDidChangeWithNotification:(NSNotification *)noti {
UITextField *textField = (UITextField *)noti.object; NSString *inputText = textField.text; NSString *primaryLanguage = [textField.textInputMode primaryLanguage]; //获取高亮部分
UITextRange *selectedRange = [textField markedTextRange]; UITextPosition *textPosition = [textField positionFromPosition:selectedRange.start
offset:0];
inputText = [self handleWithInputText:inputText]; NSString *finalText = [self finalTextAfterProcessingWithInput:inputText
maxCharacterNum:self.maxCharacterNum
primaryLanguage:primaryLanguage
textPosition:textPosition
isDoubleBytePerChineseCharacter:self.isDoubleBytePerChineseCharacter]; if (finalText.length > 0) {
textField.text = finalText;
} else if(self.intercepterNumberType == FJFTextInputIntercepterNumberTypeNumberOnly || self.intercepterNumberType == FJFTextInputIntercepterNumberTypeDecimal || self.isEmojiAdmitted == NO){
textField.text = inputText;
}
_previousText = textField.text;
}
- (void)textViewTextDidChangeWithNotification:(NSNotification *)noti {
UITextView *textView = (UITextView *)noti.object; NSString *inputText = textView.text; NSString *primaryLanguage = [textView.textInputMode primaryLanguage]; //获取高亮部分
UITextRange *selectedRange = [textView markedTextRange]; UITextPosition *textPosition = [textView positionFromPosition:selectedRange.start
offset:0];
inputText = [self handleWithInputText:inputText];
NSString *finalText = [self finalTextAfterProcessingWithInput:inputText
maxCharacterNum:self.maxCharacterNum
primaryLanguage:primaryLanguage
textPosition:textPosition
isDoubleBytePerChineseCharacter:self.isDoubleBytePerChineseCharacter];
if (finalText.length > 0) {
textView.text = finalText;
}
_previousText = textView.text;
}通知处理方法内部分别获取当前语言类型、和高亮部分,然后调用输入文本的处理方法:handleWithInputText和最大输入字符的截取方法:finalTextAfterProcessingWithInput。
D. 在
输入文本的处理方法:handleWithInputText中分别对只能输入数字、输入分数和是否允许输入表情进行处理.
// 处理 输入 字符串- (NSString *)handleWithInputText:(NSString *)inputText { if (_previousText.length >= inputText.length) { return inputText;
}
NSString *tmpReplacementString = [inputText substringWithRange:NSMakeRange(_previousText.length, (inputText.length - _previousText.length))]; // 只允许 输入 数字
if (self.intercepterNumberType == FJFTextInputIntercepterNumberTypeNumberOnly) { if ([tmpReplacementString fjf_isCertainStringType:FJFTextInputStringTypeNumber] == NO) {
inputText = _previousText;
}
} // 输入 小数
else if(self.intercepterNumberType == FJFTextInputIntercepterNumberTypeDecimal){ NSRange tmpRange = NSMakeRange(_previousText.length, 0); BOOL isCorrect = [self inputText:_previousText shouldChangeCharactersInRange:tmpRange replacementString:tmpReplacementString]; if (isCorrect == YES) { if (inputText.length == self.maxCharacterNum && [tmpReplacementString isEqualToString:@"."]) {
inputText = _previousText;
}
} else {
inputText = _previousText;
}
} // 不允许 输入 表情
else if (!self.isEmojiAdmitted && [tmpReplacementString fjf_isSpecialLetter]) {
inputText = _previousText;
}
return inputText;
}F. 在
finalTextAfterProcessingWithInput函数中依据是否为中文输入法来分别进行处理
// 核心代码- (NSString *)finalTextAfterProcessingWithInput:(NSString *)inputText
maxCharacterNum:(NSUInteger)maxCharacterNum
primaryLanguage:(NSString *)primaryLanguage
textPosition:(UITextPosition *)textPosition
isDoubleBytePerChineseCharacter:(BOOL)isDoubleBytePerChineseCharacter {
NSString *finalText = nil; if ([primaryLanguage isEqualToString:@"zh-Hans"] ||
[primaryLanguage isEqualToString:@"zh-Hant"]) { // 简繁体中文输入
// 没有高亮选择的字,则对已输入的文字进行字数统计和限制
if (!textPosition) {
finalText = [self processingTextWithInput:inputText
maxCharacterNum:maxCharacterNum
isDoubleBytePerChineseCharacter:isDoubleBytePerChineseCharacter];
}
} else { // 中文输入法以外的直接对其统计限制即可,不考虑其他语种情况
finalText = [self processingTextWithInput:inputText
maxCharacterNum:maxCharacterNum
isDoubleBytePerChineseCharacter:isDoubleBytePerChineseCharacter];
}
return finalText;
}这段代码里面判断了是否为简繁体中文输入,如果不是简繁体中文输入,直接调用processingTextWithInput方法对已输入的文字进行字数和统计的限制,如果是简繁体中文输入,判断是否为高亮选择的字,如果不是高亮选择的字,对已输入的文字进行字数和统计的限制。
G.
processingTextWithInput依据是否一个汉字对应两个字节来分别进行处理
- (NSString *)processingTextWithInput:(NSString *)inputText
maxCharacterNum:(NSUInteger)maxCharacterNum
isDoubleBytePerChineseCharacter:(BOOL)isDoubleBytePerChineseCharacter {
NSString *processingText = nil;
if (isDoubleBytePerChineseCharacter) { //如果一个汉字是双字节
processingText = [self doubleBytePerChineseCharacterSubString:inputText
maxCharacterNum:maxCharacterNum];
} else { if (inputText.length > maxCharacterNum) { NSRange rangeIndex = [inputText rangeOfComposedCharacterSequenceAtIndex:maxCharacterNum]; if (rangeIndex.length == 1) {
processingText = [inputText substringToIndex:maxCharacterNum];
} else { NSRange rangeRange = [inputText rangeOfComposedCharacterSequencesForRange:NSMakeRange(0, maxCharacterNum)];
processingText = [inputText substringWithRange:rangeRange];
} if (self.beyoudLimitBlock) { self.beyoudLimitBlock(self, processingText);
}
}
} return processingText;
}该函数判断如果一个汉字是双字节,就调用doubleBytePerChineseCharacterSubString依据是否允许输入表情,调用不同的编码方式进行处理。如果一个汉字是一个字节,直接进行最大字符截取。
四. 总结
综上所述就是FJFTextInputIntercepter这个输入框的一个设计思路,核心代码量差不多400行左右,能应对大部分的输入框要求`,使用简单。

image.png
如果你觉得你觉得这思路或是代码有什么问题,欢迎留言大家讨论下!如果觉得不错,麻烦给个喜欢或star,谢谢!
作者:林大鹏天地
链接:https://www.jianshu.com/p/e8dcaa98e6ba

随时随地看视频