iOS 仿支付宝密码支付

超、凢脫俗 2022-05-30 03:07 321阅读 0赞

> 代码地址如下：  
> [http://www.demodashi.com/demo/11484.html][http_www.demodashi.com_demo_11484.html]

### 一、准备工作 ###

*  xcode
 *  主要实现输入密码的时候不可见

### 二、程序实现 ###

![目录结构][Jm4NEJdsrYRsAmDtpjG.png]

*  实现思路怎样  
    在支付宝输入密码的时候，如果你不仔细看的话，你就会认为，握草，不是很简单的一个`UITextField` 然后将属性`secureTextEntry`设置为`YES`就可以么，然并….也许这才是支付宝做的好的地方吧，居然在输入密码的时候，什么什么也看不到，哪怕是一个数字，也不会有一闪然后变成黑点的效果。那么，问题来了，我们该怎么实现呢，在静静思考十几分钟后，终于有一个大概方法，那就是在输入密码的`UITextField`上面加`view`，并且设置为黑色，造成一种假象，而`UITextField`还是和普通的输入一样，只是输入的内容和光标不能被用户所看到。
 *  具体设计到哪些代码  
    `问题一 ：如何解决用户看不到输入内容和光标`

-(GLTextField *)passwordField
    {
        if (nil == _passwordField)
        {
            _passwordField = [[GLTextField alloc] initWithFrame:CGRectMake((kScreenWidth - 44 * 6)/2.0, 100, 44 * 6, 44)];
            _passwordField.delegate = (id)self;
            _passwordField.backgroundColor = [UIColor whiteColor];
            //将密码的文字颜色和光标颜色设置为透明色
            //之前是设置的白色 这里有个问题 如果密码太长的话 文字和光标的位置如果到了第一个黑色的密码点的时候 就看出来了
            _passwordField.textColor = [UIColor clearColor];
            _passwordField.tintColor = [UIColor clearColor];
            [_passwordField setBorderColor:UIColorFromRGB(0xdddddd) width:1];
            _passwordField.keyboardType = UIKeyboardTypeNumberPad;
            _passwordField.secureTextEntry = YES;
            [_passwordField addTarget:self action:@selector(passwordFieldDidChange:) forControlEvents:UIControlEventEditingChanged];
        }
        return _passwordField;
    }

`问题二 ：怎么做到输入密码的时候黑点显示或消失一致`

-(void)passwordFieldDidChange:(UITextField *)field
    {
        [self setDotsViewHidden];
    
        for (int i = 0; i < _passwordField.text.length; i ++)
        {
            if (_passwordDotsArray.count > i )
            {
                UIView *dotView = _passwordDotsArray[i];
                [dotView setHidden:NO];
            }
        }
    
    
        if (_passwordField.text.length == 6)
        {
            NSString *password = _passwordField.text;
            if ([password isEqualToString:_password])
            {
                    NSLog(@" 打印信息 密码正确");
            }
            else
            {
                UIAlertController *alertController = [UIAlertController alertControllerWithTitle:nil message:@"密码错误，请重新输入" preferredStyle:UIAlertControllerStyleAlert];
    
                // Create the actions.
                UIAlertAction *cancelAction = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:^(UIAlertAction *action) {
    
                    [self cleanPassword];
    
                }];
    
                // Add the actions.
                [alertController addAction:cancelAction];
    
                [self presentViewController:alertController animated:YES completion:nil];
            }
        }
    }
    
    //将所有的假密码点设置为隐藏状态
    - (void)setDotsViewHidden
    {
        for (UIView *view in _passwordDotsArray)
        {
            [view setHidden:YES];
        }
    }

`问题三：由于UITextField 是可以复制其内容的，怎么屏蔽呢？`  
这里我采取的方法是继承 `UITextField` 然后重写方法  
`- (BOOL)canPerformAction:(SEL)action withSender:(id)sender`

//禁止粘贴复制全选等
    - (BOOL)canPerformAction:(SEL)action withSender:(id)sender
    {
        UIMenuController *menuController = [UIMenuController sharedMenuController];
        if (menuController) {
            [UIMenuController sharedMenuController].menuVisible = NO;
        }
        return NO;
    }

### 三、运行效果 ###

*  直接下载demo进行运行即可
 *  运行时的截图  
    ![kEjscUIhPTzB9zYi5kJ.png][]  
    iOS 仿支付宝密码支付

> 代码地址如下：  
> [http://www.demodashi.com/demo/11484.html][http_www.demodashi.com_demo_11484.html]
> 
> 注：本文著作权归作者，由demo大师发表，拒绝转载，转载需要作者授权

[http_www.demodashi.com_demo_11484.html]: http://www.demodashi.com/demo/11484.html
[Jm4NEJdsrYRsAmDtpjG.png]: /images/20220530/ab2ae70a38634fe9af1cac46e93beb7f.png
[kEjscUIhPTzB9zYi5kJ.png]: /images/20220530/370edfe719f247c39c1a56bc696def51.png