Question

我有一个视图，用作用户验证通过短信发送给他的代码以便登录（6位数代码）的视图。

所以我只想创建一个6位数的UITextField，我希望它为每个数字都有一个下划线占位符。像这样：

任何人都知道如何实现这一目标？

谢谢！

Answer 1

您可以使用textField委托协议功能shouldChangeCharactersIn range: NSRange在键入时修改字符串。

0）确保文本字段是您要查找的文本字段

1）获取选定的文本范围，并在文本字段中获取当前文本的副本，否则会失败

2）使用这些变量，获取当前索引（Int）和currentStringIndex（String.Index）

3）确定替换字符串是删除（“”）还是实际字符

4）删除上一个字符

4.1-确保当前索引不是开始，并设置上一个位置和上一个范围

4.2-删除前一个字符并替换为'_'字符

4.3-将光标位置设置为上一个位置

5）添加字符

5.1-确保当前索引位于最大字符索引处，并设置当前位置，当前范围和下一个位置

5.2-删除当前字符并替换为新字符

5.3-将光标位置设置为下一个位置

6）因为已经修改了字符串，所以返回false

func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {

    // 0) Check and make sure textfield is the code textfield
    switch textField {
    case codeTextField:       
        // 1) Set the current selected range and the current text
        guard
            let selectedRange = textField.selectedTextRange,
            var text = textField.text
        else {
            return false
        }

        // 2) Set the current Index and String Index
        let currentIndex = textField.offset(from: textField.beginningOfDocument, to: selectedRange.start)
        let currentStringIndex = text.index((text.startIndex), offsetBy: currentIndex)

        // 3) Check if new character or delete character
        if string == "" {

            // 4.1) Make sure current index isn't the start, and set the previous position and previous range
            guard
                currentIndex > 0,
                let previousPosition = textField.position(from: textField.beginningOfDocument, offset: currentIndex-1),
                let previousRange = textField.textRange(from: previousPosition, to: previousPosition)
            else {
                return false
            }

            // 4.2) Remove the previous character and replace with an '_' character
            text.remove(at: text.index(before: currentStringIndex))
            textField.text = text
            textField.replace(previousRange, withText: "_")

            // 4.3) Set the cursor position to the previous position
            textField.selectedTextRange = textField.textRange(from: previousPosition, to: previousPosition)

        } else {
            // 5.1) Add a new character
            guard
                currentIndex < 6,
                let currentPosition = textField.position(from: textField.beginningOfDocument, offset: currentIndex),
                let currentRange = textField.textRange(from: currentPosition, to: currentPosition),
                let nextPosition = textField.position(from: textField.beginningOfDocument, offset: currentIndex+1)
            else {
                return false
            }

            // 5.2) Remove the current character and replace with the new character
            text.remove(at: currentStringIndex)
            textField.text = text
            textField.replace(currentRange, withText: string)

            // 5.3) Set the cursor position the the next position
            textField.selectedTextRange = textField.textRange(from: nextPosition, to: nextPosition)
        }

        // 6)
        return false

    default:
        return true
    }
}

向UITextField添加下划线占位符

1 个答案: