您的位置:首页 > 其它

简单实现支付密码输入框 By HL

2015-06-19 17:13 375 查看
密码输入框在微信,支付宝中比较常见

主要功能点

1.6位(或者N位)密码输入框封装



//  SBTextFieldAlert.h
/**
*  密码输入框封装
*/

#import <UIKit/UIKit.h>

@interface SBPwdTextField : UIView<UITextFieldDelegate>

@property(nonatomic,strong)  UITextField  *passwordTextField;

- (void)clearUpPassword;

@end


//
//  SBTextFieldAlert.m
//  SafeInpuTextFiled
#define kDotSize CGSizeMake (10.0f,10.0f) //密码点的大小
#define kDotCount 6  //密码点数

#import "SBPwdTextField.h"

@implementation SBPwdTextField
{
NSMutableArray *passwordIndicatorArrary;
}

-(instancetype)initWithFrame:(CGRect)frame
{
self=[super initWithFrame:frame];
if (self) {

self.layer.borderWidth=1;
self.layer.borderColor=[UIColor lightGrayColor].CGColor;

[self addSubview:self.passwordTextField];
[self initPwdTextField];
}
return self;
}

-(UITextField *)passwordTextField
{
if (!_passwordTextField) {
_passwordTextField = [[UITextField alloc] initWithFrame:CGRectMake(0, 0,50, 30)];
_passwordTextField.hidden = YES;
_passwordTextField.delegate = self;
_passwordTextField.autocapitalizationType = UITextAutocapitalizationTypeNone;
_passwordTextField.keyboardType = UIKeyboardTypeNumberPad;
[_passwordTextField addTarget:self action:@selector(PwdTextFieldDidChange:) forControlEvents:UIControlEventEditingChanged];
[self addSubview:_passwordTextField];
}
return _passwordTextField;
}

-(void)PwdTextFieldDidChange:(UITextField *)tf
{
NSLog(@"%@",tf.text);
[self setDotWithCount:tf.text.length];
}

-(void)initPwdTextField
{
//每个密码输入框的宽度
CGFloat width = self.bounds.size.width/kDotCount;

//生成分割线
for (int i = 0; i < kDotCount-1; i++)
{
UIImageView *lineImageView = [[UIImageView alloc] initWithFrame:CGRectMake((i + 1) * width, 0, 0.5f, self.bounds.size.height)];
lineImageView.backgroundColor = [UIColor grayColor];
[self addSubview:lineImageView];
}

passwordIndicatorArrary=[[NSMutableArray alloc]init];
//生成中间的点
for (int i = 0; i < kDotCount; i++)
{
UIImageView *dotImageView = [[UIImageView alloc] initWithFrame:CGRectMake((width - kDotSize.width) / 2.0f + i * width, (self.bounds.size.height - kDotSize.height) / 2.0f, kDotSize.width, kDotSize.height)];
dotImageView.backgroundColor = [UIColor blackColor];
dotImageView.layer.cornerRadius = kDotSize.width / 2.0f;
dotImageView.clipsToBounds = YES;
dotImageView.hidden = YES; //先隐藏
[self addSubview:dotImageView];

[passwordIndicatorArrary addObject:dotImageView];
}

}

- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
{
if([string isEqualToString:@"\n"])
{
//按回车关闭键盘
[textField resignFirstResponder];
return NO;
}
else if(string.length == 0)
{
//判断是不是删除键
return YES;
}
else if(textField.text.length >= kDotCount)
{
//输入的字符个数大于6,则无法继续输入,返回NO表示禁止输入
NSLog(@"输入的字符个数大于6,忽略输入");
return NO;
}
else
{
return YES;
}
}

/**
*  重置显示的点
*/
- (void)setDotWithCount:(NSInteger)count
{
for (UIImageView *dotImageView in passwordIndicatorArrary)
{
dotImageView.hidden = YES;
}

for (int i = 0; i< count; i++)
{
((UIImageView*)[passwordIndicatorArrary objectAtIndex:i]).hidden = NO;
}
if (count== kDotCount) {
NSLog(@"输入完毕");
[[NSNotificationCenter defaultCenter] postNotificationName:@"uuuu" object:self.passwordTextField.text];
}
}

/**
*  清除密码
*/
- (void)clearUpPassword
{
_passwordTextField.text = @"";
[self setDotWithCount:_passwordTextField.text.length];
}

/**
*  点击self 弹出键盘
*/
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
[_passwordTextField becomeFirstResponder];
}

- (void)dealloc
{
[_passwordTextField removeFromSuperview];
_passwordTextField=nil;
}


2.显示提示框封装

//  SBInputTextAlert.h
//  SafeInpuTextFiled

#import <UIKit/UIKit.h>
#import "SBPwdTextField.h"

@interface SBInputTextAlert : UIView

@property(nonatomic,strong)  UILabel  *titleLabel;

/**
*  密码输入框
*/
@property(nonatomic,strong)  SBPwdTextField  *TextFieldAlert;

-(void)show;
-(void)dismiss;

@end

@interface SBCoverMask : UIView
+(void)maskViewShow;
+(void)maskViewDismiss;
@end


//  SBInputTextAlert.m
//  SafeInpuTextFiled
#import "SBInputTextAlert.h"
#define SBKeyWindow [UIApplication sharedApplication].keyWindow

@interface SBInputTextAlert ()

@property(nonatomic,strong) UIView *linView;

@end

@implementation SBInputTextAlert

-(instancetype)initWithFrame:(CGRect)frame
{
self=[super initWithFrame:frame];
if (self) {
self.layer.cornerRadius=8;
self.layer.masksToBounds=YES;

[self initSubViews];
[self addSubview:self.titleLabel];
[self addSubview:self.linView];

[self  addSubview:self.TextFieldAlert];
}
return self;
}

-(UIView *)linView
{
if (!_linView) {
_linView=[[UIView alloc]initWithFrame:CGRectMake(0, CGRectGetMaxY(self.titleLabel.frame)+10, self.bounds.size.width,0.5)];
_linView.backgroundColor=[UIColor greenColor];
}
return _linView;
}

-(void)initSubViews
{
UIButton  *closeButton=[[UIButton alloc]initWithFrame:CGRectMake(0, 0, 50, 30)];
[closeButton setTitle:@"关闭" forState:UIControlStateNormal];
closeButton.backgroundColor=[UIColor greenColor];
[closeButton addTarget:self action:@selector(dismiss) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:closeButton];
}

-(UILabel *)titleLabel
{
if (!_titleLabel) {
_titleLabel=[[UILabel alloc]init];
_titleLabel.textAlignment=NSTextAlignmentCenter;
_titleLabel.font=[UIFont boldSystemFontOfSize:18];
_titleLabel.frame=CGRectMake(0,5, self.bounds.size.width,25);
}
return _titleLabel;
}

-(SBPwdTextField *)TextFieldAlert
{
if (!_TextFieldAlert) {
CGFloat textFieldwidth=(self.bounds.size.width-40);
_TextFieldAlert=[[SBPwdTextField alloc]initWithFrame:CGRectMake(20, 50 ,textFieldwidth,textFieldwidth/6)];
}
return _TextFieldAlert;
}

/**
*  显示这儿view
*/
-(void)show{
[SBCoverMask maskViewShow];
self.frame=CGRectMake(0,-100, self.bounds.size.width, self.bounds.size.height);
[UIView animateWithDuration:0.3 animations:^{
self.hidden = NO;
self.frame=CGRectMake(SBKeyWindow.frame.size.width/2-self.bounds.size.width/2,100, self.bounds.size.width, self.bounds.size.height);
[self.TextFieldAlert becomeFirstResponder];
[SBKeyWindow addSubview:self];
}];
}
/**
*  隐藏这个view
*/
-(void)dismiss{
[SBCoverMask maskViewDismiss];
[UIView animateWithDuration:0.5 animations:^{
self.hidden = YES;
[self.TextFieldAlert resignFirstResponder];
[self removeFromSuperview];
}];

//清空密码
[self.TextFieldAlert clearUpPassword];
}

@end

/**
*  蒙版MaskView
*/
@implementation SBCoverMask
+(void)maskViewShow{
SBCoverMask *view = [[SBCoverMask alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
view.backgroundColor = [UIColor blackColor];
view.alpha = 0.3;

[[UIApplication sharedApplication].keyWindow addSubview:view];
}
+(void)maskViewDismiss{
UIWindow *keyWidow=[UIApplication sharedApplication].keyWindow;
for (UIView *view in keyWidow.subviews) {
if ([view isKindOfClass:[SBCoverMask class]]) {
[view removeFromSuperview];
}
}
}

@end


使用

- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
UIButton   *CSButton=[UIButton  buttonWithType:UIButtonTypeCustom];
CSButton.frame=CGRectMake(50,350, 100, 80);
CSButton.backgroundColor=[UIColor   redColor];
[CSButton  setTitle:@"显示输入框" forState:UIControlStateNormal];
[CSButton  addTarget:self action:@selector(showKeyBord) forControlEvents:UIControlEventTouchDown];
[self.view  addSubview:CSButton];

UIButton   *CSButton2=[UIButton  buttonWithType:UIButtonTypeCustom];
CSButton2.frame=CGRectMake(self.view.frame.size.width-100-50,350, 100, 80);
CSButton2.backgroundColor=[UIColor   redColor];
[CSButton2  setTitle:@"隐藏输入框" forState:UIControlStateNormal];
[CSButton2  addTarget:self action:@selector(hideKeyBord) forControlEvents:UIControlEventTouchDown];
[self.view  addSubview:CSButton2];

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(gotoNextVC:) name:@"uuuu" object:nil];
}

-(SBInputTextAlert *)SBTextField{
if (!_SBTextField) {
_SBTextField=[[SBInputTextAlert alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width-20,200)];
_SBTextField.titleLabel.text=@"请输入6位支付密码";
_SBTextField.backgroundColor=[UIColor whiteColor];
}
return _SBTextField;
}

-(void)gotoNextVC:(NSNotification *)nti
{
NSLog(@"text=%@",nti.object);
[self.SBTextField dismiss];
secondViewController  *secvc=[[secondViewController alloc]init];
[self presentViewController:secvc animated:YES completion:nil];
}

-(void)showKeyBord
{
[self.SBTextField show];
[self.SBTextField.TextFieldAlert.passwordTextField  becomeFirstResponder];
}

-(void)hideKeyBord
{
[self.SBTextField dismiss];
[self.SBTextField.TextFieldAlert.passwordTextField  resignFirstResponder];
}


效果图 可根据设计图添加相关UI即可



Demo地址 http://files.cnblogs.com/files/sixindev/SafeInpuTextFiled.zip
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: