自定义密码输入框

来源:互联网 发布:网络作家协会好加入吗 编辑:程序博客网 时间:2024/06/09 17:03

基本样式
1.实现方式是底层为一个UIView,然后添加一个与view相同大小的UITextField,将UITextField的hidden设置为YES
2.根据需要添加添加分割线的个数(密码如果是六位的就需要添加五个分隔线),分割线使用CALayer绘制,使用其frame属性设置其大小与X,Y.
3.添加密码输入之后显示的黑色圆点,也是使用CALayer来绘制,圆点是一张图片(我使用的是一张黑色圆点图片,如有其它需求可让美工做一张其它样式的),一次性创建6个(与所需要输入的密码长度相同),将其hidden设置为YES。
4,在layoutSubviews方法中设置UITextField和分隔线和黑色圆点的frame(推荐子控件的布局在layoutSubviews中设置)
5,监听UITextField的的输入,UITextField没有提供代理方法来监听他的点击,需要注册通知来监听UITextFieldTextDidChangeNotification这个通知.
6.在监听点击的方法中判断UITextField中text的长度,根据text的长度来控制黑色圆点的hidden的YES or NO;
7,以下为实际代码,如有不足,谢请指出。

//这个值是最大输入数#define maxInputCount 10#define DXTextFieldWSize  self.frame.size@interface DXInputPasswordView ()<UITextFieldDelegate>//黑色圆点数组,布局时和控制hidden时使用@property (nonatomic, strong) NSMutableArray *dotInputArray;//分隔线数组,布局时使用@property (nonatomic, strong) NSMutableArray *lineArray;//底部的UITextField@property (nonatomic, strong) UITextField *textField;@end@implementation DXInputPasswordView- (instancetype)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {        [self setupSubviews];    }    return self;}- (instancetype)init{    self = [super init];    if (self) {        [self setupSubviews];    }    return self;}//使用懒加载来创建数组-(NSMutableArray *)pointInputArray{    if (!_dotInputArray) {        _dotInputArray = [NSMutableArray array];    }    return _dotInputArray;}-(NSMutableArray *)lineArray{    if (!_lineArray) {        _lineArray = [NSMutableArray array];    }    return _lineArray;}//添加子控件的方法-(void)setupSubviews{    self.layer.borderWidth = 1;    self.layer.borderColor = [UIColor lightGrayColor].CGColor;    UITextField *textField = [[UITextField alloc]init];    [textField becomeFirstResponder];    //边框的样式    textField.borderStyle  = UITextBorderStyleNone;    textField.backgroundColor = [UIColor redColor];    textField.hidden = YES;    //键盘的样式    textField.keyboardType = UIKeyboardTypeNumberPad;    textField.delegate     = self;    [self addSubview:textField];    _textField = textField;    //添加监听UITextField的输入    [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(textFieldTextDidChange) name:UITextFieldTextDidChangeNotification object:_textField];        //圆点的默认大小        self.dotSize = 10.0;    //添加分隔线    for (int i = 0; i < maxInputCount - 1; i++) {        CALayer *lineLayer = [[CALayer alloc]init];        lineLayer.backgroundColor = [UIColor lightGrayColor].CGColor;        [self.layer addSublayer:lineLayer];        [self.lineArray addObject:lineLayer];    }    //添加黑色圆点图片    for (int i = 0; i < maxInputCount; i++) {        CALayer *dotLayer = [[CALayer alloc]init];        [dotLayer setNeedsDisplay];        UIImage *backgroundImage = [UIImage imageNamed:@"1"];        dotLayer.contents = (__bridge id _Nullable)(backgroundImage.CGImage);        dotLayer.hidden = YES;        [self.layer addSublayer:dotLayer];        [self.pointInputArray addObject:dotLayer];    }}
//监听其点击的方法-(void)textFieldTextDidChange{    //显示圆点数    [self setDotWithCount:_textField.text.length];    //判断输入的值是否大于输入长度,如果大于退出键盘    if(_textField.text.length >= maxInputCount) {        [_textField resignFirstResponder];        if ([self.delegate respondsToSelector:@selector(inputPasswordView:completeInput:)]) {            [self.delegate inputPasswordView:self completeInput:_textField.text];        }    }}
//控制圆点的显示与隐藏-(void)setDotWithCount:(NSInteger)count{    for (int i = 0; i < maxInputCount; i++) {        CALayer *pointLayer = _dotInputArray[i];        if (i < count) {            pointLayer.hidden = NO;        } else {            pointLayer.hidden = YES;        }    }}
//清空输入-(void)clearUpPassword{    _textField.text = nil;    [self setDotWithCount:0];    [_textField becomeFirstResponder];}-(void)layoutSubviews{    [super layoutSubviews];    _textField.frame = CGRectMake(0, 0,DXTextFieldWSize.width,DXTextFieldWSize.height);    CGFloat lineInterval = DXTextFieldWSize.width / maxInputCount;    for (int i = 0; i < maxInputCount - 1; i++) {        CALayer *lineLayer = self.lineArray[i];        lineLayer.frame    = CGRectMake((i + 1) *lineInterval, 0, 1, DXTextFieldWSize.height);    }    for (int i = 0; i < maxInputCount; i++) {        CALayer *dotLayer = self.dotInputArray[i];        dotLayer.frame    = CGRectMake(i *lineInterval+ (lineInterval - self.dotSize) /2 , (self.frame.size.height - self.dotSize)/2, self.dotSize, self.dotSize);    }}

//设置边框的颜色

-(void)setBoardColor:(UIColor *)boardColor{    _boardColor = boardColor;    self.layer.borderColor = boardColor.CGColor;}

//设置分隔线的颜色

-(void)setIntervalLineColor:(UIColor *)intervalLineColor{    _intervalLineColor = intervalLineColor;    for (int i = 0; i < maxInputCount - 1; i++) {        CALayer *lineLayer = self.lineArray[i];        lineLayer.backgroundColor =  intervalLineColor.CGColor;    }}
0 1
原创粉丝点击