Question

我想接受Card details as input from user。条件是first 10 character will be hidden，user will be allowed to enter next 6 character.

我已经使用了四个文本字段（我的假设）。欢迎任何其他建议。

Q.1。 如何允许用户直接从第3个文字字段中的第11个字符输入？

对于到期日期字段，我使用了两个文本字段。

Q.2。 如何制作文字字段只有底部的边框（没有左边，右边和上边框）？

Answer 1

<强> Q.1。如何允许用户直接从第3个文本字段中的第11个字符输入？

A-1：txt3.becomeFirstResponder()

<强> Q.2。如何使文本字段只在底部有边框（没有左边，右边和上边框）？

A-2：使用以下代码行：

 func addbottomBorderWithColor(view : UIView, color: UIColor, width: CGFloat) {
        let border = CALayer()
        border.backgroundColor = color.CGColor
        border.frame = CGRectMake(15.0, view.frame.size.height-width, view.frame.size.width,width )
        view.layer.addSublayer(border)
    }

Answer 2

我使用以下方法解决了这个问题：

四个文本字段，第一个和第二个只读。在第三个文本字段中，我放置了带有两个加密值（即XX）的标签，第三个文本字段仅接受两个数字。第四个文本字段接受四位数字。

注意：我使用过这种标签和文本字段方法，因为我已经从数据库或其他来源获得了信用卡/借记卡号码（14位数）。我只需要接受用户的最后6位数字并与现有值进行比较。

当用户在第三个文本字段中输入两位数字时，它会自动跳转到第四个文本字段。此后，当用户在第四个文本字段中输入四位数字时，它会自动跳转到到期月份文本字段，然后是到期年份。
setBorderColor函数仅将底部边框颜色设置为Expiry month和Year textfield。
我已将UIToolbar with done button添加到所有文本字段的数字小键盘（在设计时设置）。

以下是我用过的代码：

@IBOutlet weak var txtCardDetails1: UITextField!

    @IBOutlet weak var txtCardDetails2: UITextField!
    @IBOutlet weak var txtCardDetails3: UITextField!
    @IBOutlet weak var txtCardDetails4: UITextField!

    @IBOutlet weak var txtExpiryMonth: UITextField!
    @IBOutlet weak var txtExpiryYear: UITextField!

    let objBlackColor = UIColor.blackColor()
    let objGreyColor = UIColor.grayColor()

覆盖func viewDidLoad（）{ super.viewDidLoad（）

        //Add done button to numeric pad keyboard
        let toolbarDone = UIToolbar.init()
        toolbarDone.sizeToFit()
        let barBtnDone = UIBarButtonItem.init(barButtonSystemItem: UIBarButtonSystemItem.Done,
                                              target: self, action: #selector(VerifyCardViewController.doneButton_Clicked(_:)))

        toolbarDone.items = [barBtnDone] // You can even add cancel button too
        txtCardDetails3.inputAccessoryView = toolbarDone
        txtCardDetails4.inputAccessoryView = toolbarDone
        txtExpiryMonth.inputAccessoryView = toolbarDone
        txtExpiryYear.inputAccessoryView = toolbarDone

        // Set an action on EditingChanged event of textfield
        txtCardDetails3.addTarget(self, action: #selector(VerifyCardViewController.textFieldDidChange(_:)), forControlEvents: UIControlEvents.EditingChanged)

        txtCardDetails4.addTarget(self, action: #selector(VerifyCardViewController.textFieldDidChange(_:)), forControlEvents: UIControlEvents.EditingChanged)

        txtExpiryMonth.addTarget(self, action: #selector(VerifyCardViewController.textFieldDidChange(_:)), forControlEvents: UIControlEvents.EditingChanged)

        setBorderColor(txtExpiryMonth,setBorderColor: objGreyColor)
        setBorderColor(txtExpiryYear,setBorderColor: objGreyColor)
    }


 //Set bottom border color to textfield 
    func setBorderColor(objTextField : UITextField, setBorderColor objColor:UIColor) {
        let bottomLine = CALayer()
        bottomLine.frame = CGRectMake(0.0, objTextField.frame.height - 1, objTextField.frame.width, 1.0)
        bottomLine.backgroundColor = objColor.CGColor

        objTextField.borderStyle = UITextBorderStyle.None
        objTextField.layer.addSublayer(bottomLine)
    }

    func doneButton_Clicked(sender: AnyObject) { // Hide keyboard when done button is clicked
        txtCardDetails3.resignFirstResponder()
        txtCardDetails4.resignFirstResponder()
        txtExpiryMonth.resignFirstResponder()
        txtExpiryYear.resignFirstResponder()
    }

  func textFieldDidChange(textField: UITextField){ // Change text focus as per condition

        let text = textField.text

        if textField.tag == 101 { // Set tag to textfield (if multiple) during design time
            if text?.utf16.count==2 {
                txtCardDetails4.becomeFirstResponder() // Move to next text field
            }
        }
        else if textField.tag == 102 {
            if text?.utf16.count==4 {
                txtExpiryMonth.becomeFirstResponder()
            }
        }
        else if textField.tag == 103 {
            if text?.utf16.count==2 {
                txtExpiryYear.becomeFirstResponder()
            }
        }
    }

    func textFieldDidBeginEditing(textField: UITextField) {

        if textField.tag == 103 { // Set border color based on focus
           setBorderColor(txtExpiryMonth,setBorderColor: objBlackColor)
        }
        else if textField.tag == 104 {
           setBorderColor(txtExpiryMonth,setBorderColor: objBlackColor)
        }

        textField.becomeFirstResponder()
    }

    func textFieldShouldReturn(textField: UITextField) -> Bool {
        textField.resignFirstResponder()
        return true;
    }

 //User can enter two digits in textfield with tag 101, 103, 104 and four digits in textfield with tag 102
    func textField(textField: UITextField, shouldChangeCharactersInRange range: NSRange, replacementString string: String) -> Bool {
        if let text = textField.text {

            let newStr = (text as NSString)
                .stringByReplacingCharactersInRange(range, withString: string)
            if newStr.isEmpty {
                return true
            }
            let intvalue = Int(newStr)

            if textField.tag == 101 || textField.tag == 103 || textField.tag == 104{
                 return (intvalue >= 0 && intvalue <= 99) ? true : false
            }
            else if textField.tag == 102 {
                 return (intvalue >= 0 && intvalue <= 9999) ? true : false
            }           

        }
        return true
    }

Swift：UITextField的加密输入，用于Card详细信息

2 个答案: