如何在Swift中切换UITextField安全文本条目(隐藏密码)？

Question

我当前有一个UITextfield带有眼睛图标的按钮,当按下时应该打开和关闭安全文本条目.

我知道您可以在属性检查器中选中"安全文本输入"框,但是如何操作它以便在按下图标时切换？

Answer 1

使用此代码,

iconClick是bool变量,或者你需要其他条件检查它,

var iconClick = true

眼动作方法:

@IBAction func iconAction(sender: AnyObject) {
        if(iconClick == true) {
            passwordTF.secureTextEntry = false
        } else {
            passwordTF.secureTextEntry = true
        }

        iconClick = !iconClick
    }

希望它有所帮助

Answer 2

这种意外的副作用是,如果用户切换到不安全状态,然后返回到安全状态,则在用户继续键入时将清除现有文本.除非我们重置所选的文本范围,否则光标也可能会以错误的位置结束.

下面是一个处理这些情况的实现(Swift 4)

extension UITextField {
    func togglePasswordVisibility() {
        isSecureTextEntry = !isSecureTextEntry

        if let existingText = text, isSecureTextEntry {
            /* When toggling to secure text, all text will be purged if the user 
             continues typing unless we intervene. This is prevented by first 
             deleting the existing text and then recovering the original text. */
            deleteBackward()

            if let textRange = textRange(from: beginningOfDocument, to: endOfDocument) {
                replace(textRange, withText: existingText)
            }
        }

        /* Reset the selected text range since the cursor can end up in the wrong
         position after a toggle because the text might vary in width */
        if let existingSelectedTextRange = selectedTextRange {
            selectedTextRange = nil
            selectedTextRange = existingSelectedTextRange
        }
    }
}

此代码段正在使用该replace(_:withText:)函数,因为它会触发.editingChanged事件,这在我的应用程序中很有用.设置也text = existingText应该没问题.

Answer 3

为什么要使用额外的var.在眼睛按钮的动作方法中,只需执行以下操作

password.secureTextEntry = !password.secureTextEntry

UPDATE

Swift 4.2(根据@ROC评论)

password.isSecureTextEntry.toggle()

Answer 4

Swift 4解决方案

对于简单切换isSecureTextEntry属性,您不需要额外的if语句

func togglePasswordVisibility() {
        password.isSecureTextEntry = !password.isSecureTextEntry
    }

但是当您切换isSecureTextEntry时出现问题UITextField不会重新计算文本宽度,并且我们在文本右侧有额外的空间.为避免这种情况,您应该以这种方式替换文本

func togglePasswordVisibility() {
        password.isSecureTextEntry = !password.isSecureTextEntry
        if let textRange = password.textRange(from: password.beginningOfDocument, to: password.endOfDocument) {
            password.replace(textRange, withText: password.text!)
        }
    }

UPDATE

Swift 4.2

代替

password.isSecureTextEntry = !password.isSecureTextEntry

你可以这样做

password.isSecureTextEntry.toggle()

Answer 5

我为此写了扩展名。提供密码切换。

1. 在您的资产中，首先添加您想要切换的图像。

2. 为 UITextField 添加以下扩展。

   extension UITextField {
   fileprivate func setPasswordToggleImage(_ button: UIButton) {
       if(isSecureTextEntry){
           button.setImage(UIImage(named: "ic_password_visible"), for: .normal)
       }else{
           button.setImage(UIImage(named: "ic_password_invisible"), for: .normal)
   
       }
   }
   
   func enablePasswordToggle(){
       let button = UIButton(type: .custom)
       setPasswordToggleImage(button)
       button.imageEdgeInsets = UIEdgeInsets(top: 0, left: -16, bottom: 0, right: 0)
       button.frame = CGRect(x: CGFloat(self.frame.size.width - 25), y: CGFloat(5), width: CGFloat(25), height: CGFloat(25))
       button.addTarget(self, action: #selector(self.togglePasswordView), for: .touchUpInside)
       self.rightView = button
       self.rightViewMode = .always
   }
   @IBAction func togglePasswordView(_ sender: Any) {
       self.isSecureTextEntry = !self.isSecureTextEntry
       setPasswordToggleImage(sender as! UIButton)
   }
   }
   

3. 您的UITextFieldOutlet上的附加电话信息

    override func viewDidLoad() {
        super.viewDidLoad()
        txtPassword.enablePasswordToggle()
        txtConfirmPassword.enablePasswordToggle()
    }
   

Answer 6

使用UITextFiled右视图显示togle buuton

 var rightButton  = UIButton(type: .custom)
 rightButton.frame = CGRect(x:0, y:0, width:30, height:30)
 yourtextfield.rightViewMode = .always
 yourtextfield.rightView = rightButton

Answer 7

如果您需要在多个地方具有类似功能的 TextField，最好将UITextField以下示例子类化-

import UIKit

class UIShowHideTextField: UITextField {

    let rightButton  = UIButton(type: .custom)

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    required override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

    func commonInit() {
        rightButton.setImage(UIImage(named: "password_show") , for: .normal)
        rightButton.addTarget(self, action: #selector(toggleShowHide), for: .touchUpInside)
        rightButton.frame = CGRect(x:0, y:0, width:30, height:30)

        rightViewMode = .always
        rightView = rightButton
        isSecureTextEntry = true
    }

    @objc
    func toggleShowHide(button: UIButton) {
        toggle()
    }

    func toggle() {
        isSecureTextEntry = !isSecureTextEntry
        if isSecureTextEntry {
            rightButton.setImage(UIImage(named: "password_show") , for: .normal)
        } else {
            rightButton.setImage(UIImage(named: "password_hide") , for: .normal)
        }
    }

}

之后你可以在任何 ViewController 中使用它，

class ViewController: UIViewController {

    @IBOutlet var textField: UIShowHideTextField!

    override func viewDidLoad() {
        super.viewDidLoad()
        textField.becomeFirstResponder()
    }

}

Answer 8

对于目标c

在viewdidload方法中为RightButton设置图像

[RightButton setImage:[UIImage imageNamed:@"iconEyesOpen"] forState:UIControlStateNormal];

    [RightButton setImage:[UIImage imageNamed:@"iconEyesClose"] forState:UIControlStateSelected];

然后为该RightButton设置action方法

-(IBAction)RightButton:(id)sender
{

    if (_rightButton.selected)
    {

        _rightButton.selected = NO;

        _passwordText.secureTextEntry = YES;


        if (_passwordText.isFirstResponder) {
            [_passwordText resignFirstResponder];
            [_passwordText becomeFirstResponder];
        }
    }
    else
    {

      _rightButton.selected = YES;

        _passwordText.secureTextEntry = NO;

        if (_passwordText.isFirstResponder) {
            [_passwordText resignFirstResponder];
            [_passwordText becomeFirstResponder];
        }

    }
}