Skip to content

Verify code input view. Support security type for password.短信验证码输入框,支持密文模式

License

Notifications You must be signed in to change notification settings

CRAnimation/CRBoxInputView

Repository files navigation

CRBoxInputViewHeadImg.png CI Status Version License Platform

Tip

  • 若图片加载不出来,请尝试开全局梯子
  • 如果好用,可以给个Star。您的支持是我最大的动力!
  • 建议使用前运行Demo。常用功能在Demo中都有体现。

组件特点

  • 支持iOS12短信验证码自动填充
  • 支持Masonry
  • 支持密文显示
  • 支持自定义密文图片/view
  • 支持动态修改codeLength

该组件适用于短信验证码,密码输入框,手机号码输入框这些场景。
希望你可以喜欢!

Pod安装

CRBoxInputView 可以通过 CocoaPods. 来安装, 只需简单的在你的 Podfile 中添加如下代码:

pod 'CRBoxInputView', '1.2.1'

示列

下载源代码后,可以从Example目录中执行 pod install,然后运行Demo。 iPhone 8 Copy 2.png

快速指南

类型 示例图片
Base Normal.png
Placeholder Placeholder.png
CustomBox CustomBox.png
Line Line.png
SecretSymbol SecretSymbol.png
SecretImage SecretImage.png
SecretView SecretView.png
ResetCodeLength ResetCodeLength.png

使用说明

Base

Normal.png

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithFrame:CGRectMake(0, 0, 200, 50)];
boxInputView.codeLength = 4;// 不设置时,默认4
boxInputView.keyBoardType = UIKeyboardTypeNumberPad;// 不设置时,默认UIKeyboardTypeNumberPad
[boxInputView loadAndPrepareViewWithBeginEdit:YES]; // BeginEdit:是否自动启用编辑模式
[self.view addSubview:boxInputView];

// 输入类型(纯数字)
_boxInputView.inputType = CRInputType_Number;

// 输入类型(正则表达式)
//_boxInputView.inputType = CRInputType_Regex;
//_boxInputView.customInputRegex = @"[^0-9]";

// 获取值
// 方法1, 当输入文字变化时触发回调block
boxInputView.textDidChangeblock = ^(NSString *text, BOOL isFinished) {
    NSLog(@"text:%@", text);
};
// 方法2, 普通的只读属性
NSLog(@"textValue:%@", boxInputView.textValue);

// 清空
[boxInputView clearAllWithBeginEdit:YES]; // BeginEdit:清空后是否自动启用编辑模式

Placeholder

Placeholder.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.cellPlaceholderTextColor = [UIColor colorWithRed:114/255.0 green:116/255.0 blue:124/255.0 alpha:0.3]; //可选
cellProperty.cellPlaceholderFont = [UIFont systemFontOfSize:20]; //可选

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.ifNeedCursor = NO; //可选
boxInputView.placeholderText = @"露可娜娜"; //必需
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:YES];

Ps:有一回,一个逗比队友,被对面娜可露露抓急了,口误喊成了“露可娜娜”。。。


CustomBox

CustomBox.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.cellBgColorNormal = color_FFECEC;
cellProperty.cellBgColorSelected = [UIColor whiteColor];
cellProperty.cellCursorColor = color_master;
cellProperty.cellCursorWidth = 2;
cellProperty.cellCursorHeight = 30;
cellProperty.cornerRadius = 4;
cellProperty.borderWidth = 0;
cellProperty.cellFont = [UIFont boldSystemFontOfSize:24];
cellProperty.cellTextColor = color_master;
cellProperty.configCellShadowBlock = ^(CALayer * _Nonnull layer) {
    layer.shadowColor = [color_master colorWithAlphaComponent:0.2].CGColor;
    layer.shadowOpacity = 1;
    layer.shadowOffset = CGSizeMake(0, 2);
    layer.shadowRadius = 4;
};

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.boxFlowLayout.itemSize = CGSizeMake(50, 50);
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:YES];

Line

Line.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.showLine = YES; //必需
cellProperty.customLineViewBlock = ^CRLineView * _Nonnull{
    CRLineView *lineView = [CRLineView new];
    lineView.underlineColorNormal = [color_master colorWithAlphaComponent:0.3];
    lineView.underlineColorSelected = [color_master colorWithAlphaComponent:0.7];
    lineView.underlineColorFilled = color_master;
    [lineView.lineView mas_remakeConstraints:^(MASConstraintMaker *make) {
        make.height.mas_equalTo(4);
        make.left.right.bottom.offset(0);
    }];

    lineView.selectChangeBlock = ^(CRLineView * _Nonnull lineView, BOOL selected) {
        if (selected) {
            [lineView.lineView mas_updateConstraints:^(MASConstraintMaker *make) {
                make.height.mas_equalTo(6);
            }];
        } else {
            [lineView.lineView mas_updateConstraints:^(MASConstraintMaker *make) {
                make.height.mas_equalTo(4);
            }];
        }
    };
    
    return lineView;
}; //可选

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:YES];

SecretSymbol

SecretSymbol.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.securitySymbol = @"*"; //可选

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.ifNeedSecurity = YES; //必需(你可以在任何时候修改该属性,并且已经存在的文字会自动刷新。)
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:NO];

_boxInputView.ifClearAllInBeginEditing = YES;
[_boxInputView reloadInputString:@"5678"];

SecretImage

SecretImage.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.securityType = CRBoxSecurityCustomViewType; //必需
cellProperty.customSecurityViewBlock = ^UIView * _Nonnull{
    CRSecrectImageView *secrectImageView = [CRSecrectImageView new];
    secrectImageView.image = [UIImage imageNamed:@"smallLock"];
    secrectImageView.imageWidth = 23;
    secrectImageView.imageHeight = 27;
    
    return secrectImageView;
}; //必需

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.ifNeedSecurity = YES; //必需(你可以在任何时候修改该属性,并且已经存在的文字会自动刷新。)
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:YES];

SecretView

SecretView.png

CRBoxInputCellProperty *cellProperty = [CRBoxInputCellProperty new];
cellProperty.securityType = CRBoxSecurityCustomViewType; //必需
cellProperty.customSecurityViewBlock = ^UIView * _Nonnull{
    UIView *customSecurityView = [UIView new];
    customSecurityView.backgroundColor = [UIColor clearColor];

    // circleView
    static CGFloat circleViewWidth = 20;
    UIView *circleView = [UIView new];
    circleView.backgroundColor = color_master;
    circleView.layer.cornerRadius = 4;
    [customSecurityView addSubview:circleView];
    [circleView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.width.height.mas_equalTo(circleViewWidth);
        make.centerX.offset(0);
        make.centerY.offset(0);
    }];

    return customSecurityView;
}; //可选

CRBoxInputView *boxInputView = [[CRBoxInputView alloc] initWithCodeLength:4];
boxInputView.ifNeedSecurity = YES; //必需(你可以在任何时候修改该属性,并且已经存在的文字会自动刷新。)
boxInputView.customCellProperty = cellProperty;
[boxInputView loadAndPrepareViewWithBeginEdit:YES];

ResetCodeLength

ResetCodeLength.png

[boxInputView resetCodeLength:_boxInputView.codeLength+1 beginEdit:YES];

属性和方法

CRBoxInputCellProperty

#pragma mark - UI
@property (assign, nonatomic) CGFloat borderWidth;
@property (copy, nonatomic) UIColor *cellBorderColorNormal;
@property (copy, nonatomic) UIColor *cellBorderColorSelected;
@property (copy, nonatomic) UIColor *__nullable cellBorderColorFilled;
@property (copy, nonatomic) UIColor *cellBgColorNormal;
@property (copy, nonatomic) UIColor *cellBgColorSelected;
@property (copy, nonatomic) UIColor *__nullable cellBgColorFilled;
@property (assign, nonatomic) CGFloat cornerRadius;

#pragma mark - cursor(光标)
@property (copy, nonatomic) UIColor *cellCursorColor;
@property (assign, nonatomic) CGFloat cellCursorWidth;
@property (assign, nonatomic) CGFloat cellCursorHeight;

#pragma mark - line
@property (assign, nonatomic) BOOL showLine;

#pragma mark - label
@property (copy, nonatomic) UIFont *cellFont;
@property (copy, nonatomic) UIColor *cellTextColor;

#pragma mark - Security
@property (assign, nonatomic) BOOL ifShowSecurity;
@property (copy, nonatomic) NSString *securitySymbol;
@property (assign, nonatomic) CRBoxSecurityType securityType;

#pragma mark - Placeholder
@property (copy, nonatomic) UIColor *cellPlaceholderTextColor;
@property (copy, nonatomic) UIFont *cellPlaceholderFont;

#pragma mark - Block
/**
自定义密文View回调
*/
@property (copy, nonatomic) CustomSecurityViewBlock customSecurityViewBlock;
/**
自定义下划线回调
*/
@property (copy, nonatomic) CustomLineViewBlock customLineViewBlock;
/**
自定义阴影回调
*/
@property (copy, nonatomic) ConfigCellShadowBlock __nullable configCellShadowBlock;

CRBoxFlowLayout

@property (assign, nonatomic) BOOL ifNeedEqualGap;
@property (assign, nonatomic) NSInteger itemNum;

CRBoxInputView

// Security
@property (assign, nonatomic) BOOL ifNeedSecurity;
@property (assign, nonatomic) CGFloat securityDelay;

@property (assign, nonatomic) BOOL ifNeedCursor;
@property (nonatomic, assign) NSInteger codeLength;
@property (assign, nonatomic) UIKeyboardType keyBoardType;
@property (null_unspecified,nonatomic,copy) UITextContentType textContentType NS_AVAILABLE_IOS(10_0);
@property (strong, nonatomic) NSString  * _Nullable placeholderText;
@property (assign, nonatomic) BOOL ifClearAllInBeginEditing;

@property (copy, nonatomic) TextDidChangeblock _Nullable textDidChangeblock;
@property (copy, nonatomic) TextEditStatusChangeblock _Nullable textEditStatusChangeblock;
@property (strong, nonatomic) CRBoxFlowLayout * _Nullable boxFlowLayout;
@property (strong, nonatomic) CRBoxInputCellProperty * _Nullable customCellProperty;
@property (strong, nonatomic, readonly) NSString  * _Nullable textValue;
@property (strong, nonatomic) UIView * _Nullable inputAccessoryView;

- (void)loadAndPrepareView;
- (void)loadAndPrepareViewWithBeginEdit:(BOOL)beginEdit;
- (void)reloadInputString:(NSString *_Nullable)value; // 重载输入的数据(用来设置预设数据)
- (void)clearAll;
- (void)clearAllWithBeginEdit:(BOOL)beginEdit;

- (UICollectionView *_Nullable)mainCollectionView;
- (void)quickSetSecuritySymbol:(NSString *_Nullable)securitySymbol;

// 你可以在继承的子类中调用父类方法
// You can inherit and call super
- (void)initDefaultValue;
- (UICollectionViewCell *_Nullable)customCollectionView:(UICollectionView *_Nullable)collectionView cellForItemAtIndexPath:(NSIndexPath *_Nullable)indexPath;

CRBoxInputCell

// 你可以在继承的子类中重写父类方法
// You can inherit and rewrite
- (UIView *)createCustomSecurityView;

CRLineView

@property (strong, nonatomic) UIView    *lineView;

@property (copy, nonatomic) UIColor *underlineColorNormal;
@property (copy, nonatomic) UIColor *underlineColorSelected;
@property (copy, nonatomic) UIColor *underlineColorFilled;

其他问题

作者

BearRan, [email protected]

反馈

如果你在使用这个控件时遇到了问题,可以通过E-mail告诉我,或者为此开一个issuse。

License

CRBoxInputView is available under the MIT license. See the LICENSE file for more info.

About

Verify code input view. Support security type for password.短信验证码输入框,支持密文模式

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •