UITextField — ce que c'est, configuration du champ de saisie et principe de fonctionnement

Qu'est-ce que UITextField

UITextField est une classe du framework UIKit conçue pour la saisie de texte sur une seule ligne par l'utilisateur. La classe hérite de UIControl, permettant de s'abonner aux événements de saisie via le mécanisme target-action : addTarget(self, action: Selector("textChanged:"), for: editingChanged). UITextField affiche une bordure (borderStyle), un texte placeholder lorsque le champ est vide, un bouton d'effacement (clearButtonMode) et peut contenir des vues auxiliaires gauche/droite. Le champ affiche/masque automatiquement le clavier lors du gain/perte de focus via becomeFirstResponder et resignFirstResponder. La taille du champ est déterminée par intrinsicContentSize en fonction de la police et du style de bordure. Pour créer un UITextField dans Interface Builder (Storyboard/XIB), utilisez la bibliothèque d'objets ; par programmation, utilisez l'initialiseur UITextField(frame: CGRect). La classe est entièrement compatible avec l'architecture iOS moderne : Combine publishers, @Published dans SwiftUI via UIViewRepresentable et Diffable Data Source pour les formulaires.

Types de clavier UIKeyboardType

UITextField prend en charge 12 types de clavier via la propriété keyboardType. Chaque type optimise l'ensemble des caractères pour un scénario de saisie spécifique. UIKeyboardType.default — clavier QWERTY standard. UIKeyboardType.numberPad — chiffres uniquement sans symboles supplémentaires (idéal pour les codes PIN et numéros de téléphone). UIKeyboardType.emailAddress — clavier avec @ et point sur la couche principale. UIKeyboardType.URL — clavier avec .com, / et point sur la couche principale. UIKeyboardType.phonePad — clavier numérique avec +, *, # pour la saisie de numéros de téléphone. UIKeyboardType.decimalPad — chiffres avec point décimal pour la saisie de prix. UIKeyboardType.webSearch — clavier avec bouton Go optimisé pour les requêtes de recherche. UIKeyboardType.asciiCapable — caractères ASCII uniquement pour le texte latin. Le clavier apparaît lors de l'appel à becomeFirstResponder et se masque lors de l'appel à resignFirstResponder. Le type de clavier peut être modifié dynamiquement pendant l'édition.

Délégué UITextFieldDelegate et ses méthodes

UITextFieldDelegate est un protocole qui définit le comportement du champ de texte à différentes étapes de la saisie. Méthodes principales : textFieldShouldBeginEditing(textField) — retourne un Bool permettant ou refusant le début de l'édition ; textFieldDidBeginEditing — appelé après l'apparition du clavier ; textFieldShouldEndEditing — vérifie si l'édition peut être terminée (si false, le champ ne perd pas le focus) ; textFieldDidEndEditing — appelé après la disparition du clavier ; textFieldShouldChangeCharactersInRange — appelé à chaque saisie de caractère, permet de filtrer la saisie (un seul caractère autorisé, si false est retourné — le caractère n'est pas ajouté) ; textFieldShouldReturn — appelé lors de l'appui sur Return/Go/Next/Search, utilisé pour passer au champ suivant. Le délégué n'est pas Optional : toutes les méthodes ont une implémentation par défaut, mais pour un comportement personnalisé, vous devez surcharger la méthode correspondante.

Gestion du focus via shouldReturn

La méthode shouldReturn est le modèle standard pour naviguer entre les champs d'un formulaire. Implémentation : textFieldShouldReturn(textField) — vérifiez quel textField a déclenché l'événement et déplacez le focus vers le champ suivant via becomeFirstResponder(). Si c'est le dernier champ, appelez resignFirstResponder() pour masquer le clavier. Utilisez IBOutlet collection ou des IBOutlets séparés pour chaque champ afin de stocker les références aux champs.

Secure Text Entry et vues left/right personnalisées

isSecureTextEntry — une propriété UITextField qui, lorsqu'elle est true, remplace les caractères saisis par des points (•) et bloque la copie de texte via UIMenuController. Utilisé pour les champs de mot de passe, les codes PIN, CVV. Lors du passage entre le mode sécurisé et le texte brut (show/hide password), définissez textField.isSecureTextEntry.toggle(). Important : lors du changement d'isSecureTextEntry, le texte du champ est réinitialisé — sauvegardez-le au préalable. LeftView et RightView sont des UIView personnalisés affichés à l'intérieur du champ de saisie à gauche ou à droite. Utilisation typique : une icône de recherche dans leftView, un bouton « Effacer » dans rightView. Configuration : textField.leftViewMode = always (toujours) ou whileEditing (uniquement pendant l'édition). Les vues left/right sont automatiquement positionnées à l'intérieur du champ de texte en tenant compte du padding. La taille de la vue est définie via bounds ou Auto Layout.

import UIKit

class LoginViewController: UIViewController {
    let passwordField = UITextField()

    override func viewDidLoad() {
        super.viewDidLoad()
        passwordField.isSecureTextEntry = true
        passwordField.placeholder = "Password"
        passwordField.keyboardType = .asciiCapable
        passwordField.delegate = self

        // Bouton personnalisé afficher/masquer le mot de passe
        let showButton = UIButton(type: .system)
        showButton.setTitle("Afficher", for: .normal)
        showButton.addTarget(self, action: #selector(togglePasswordVisibility),
                       for: .touchUpInside)
        passwordField.rightView = showButton
        passwordField.rightViewMode = .always
    }

    @objc func togglePasswordVisibility() {
        passwordField.isSecureTextEntry.toggle()
    }
}

Configuration de UITextInputTraits

UITextInputTraits est un protocole qui définit l'apparence visuelle et comportementale du clavier pour UITextField. Propriétés principales : autocorrectionType (.default, .no, .yes) — active ou désactive la correction automatique du texte ; autocapitalizationType (.none, .words, .sentences, .allCharacters) — verrouillage automatique des majuscules pour le premier caractère ; spellCheckingType — vérification orthographique ; returnKeyType (.done, .go, .next, .search, .send, .continue, .join, .route, .emergencyCall) — texte du bouton Return sur le clavier ; enablesReturnKeyAutomatically — désactivation automatique du bouton Return lorsque le champ est vide. Pour les champs de saisie de nom, utilisez autocapitalizationType = .words ; pour l'email, utilisez autocorrectionType = .no ; pour l'URL, utilisez keyboardType = .URL + autocapitalizationType = .none. Les traits sont configurés après l'initialisation du champ avant son affichage. La modification dynamique des traits met à jour le clavier lors de sa prochaine apparition.

Return Key Type et navigation dans le formulaire

Return Key Type définit le texte du bouton sur le clavier : Next — passer au champ suivant, Done — terminer la saisie, Search — lancer la recherche, Send — envoyer le formulaire, Continue — continuer le remplissage. Combiné avec la méthode déléguée shouldReturn, returnKeyType permet une UX naturelle : l'utilisateur remplit les champs, appuie sur Next pour passer au suivant, et Done pour envoyer sur le dernier champ. Pour la personnalisation du texte du bouton, utilisez UIButtonConfiguration dans iOS 15+.

Placeholder, formatage et masque de saisie

Le placeholder de UITextField est le texte affiché en gris lorsque le champ est vide. Configuration : textField.placeholder = "Enter email". Pour personnaliser la couleur et la police du placeholder, utilisez attributedPlaceholder avec NSAttributedString. Le masque de saisie est implémenté via la méthode déléguée shouldChangeCharactersInRange — prend en charge les formats de numéro de téléphone, date, carte de crédit et SNILS. Le masque de saisie permet de séparer l'affichage de la valeur : l'utilisateur voit un texte formaté (par exemple, +7 (999) 999-99-99), tandis que le modèle stocke « 79999999999 ». Exemple d'implémentation : stockez le masque comme une chaîne avec des caractères X pour le remplacement ; à chaque saisie, formez la chaîne formatée et retournez false dans shouldChangeCharactersInRange, en remplaçant le texte du champ via textField.text = formattedText. Pour les nombres, utilisez NumberFormatter et le keyboardType decimal.

extension LoginViewController: UITextFieldDelegate {
    func textFieldShouldReturn(
        textField: UITextField
    ) -> Bool {
        if textField == emailField {
            passwordField.becomeFirstResponder()
        } else if textField == passwordField {
            textField.resignFirstResponder()
            loginTapped()
        }
        return true
    }

    func textField(
        textField: UITextField,
        shouldChangeCharactersIn range: NSRange,
        replacementString string: String
    ) -> Bool {
        // Bloquer les espaces dans l'email
        if textField == emailField && string == " " {
            return false
        }
        // Limite de longueur du mot de passe
        if textField == passwordField {
            let newLength = (textField.text?.count ?? 0) +
                string.count - range.length
            return newLength <= 32
        }
        return true
    }
}

Exemples de code : validation et formulaire

Examinons un exemple complet d'implémentation d'un formulaire de connexion avec UITextField, validation d'email et retour visuel. Le formulaire contient deux champs : emailField (clavier emailAddress, sans autocorrection) et passwordField (secureTextEntry). La validation est effectuée dans shouldChangeCharactersInRange et en supplément lors de l'appui sur le bouton Login. Pour le retour visuel : bordure rouge (layer.borderColor) en cas d'erreur, verte — en cas de validation réussie. Réinitialisation de la bordure au début de l'édition dans textFieldDidBeginEditing.

Validation d'email avec expression régulière

La validation d'email est effectuée via NSPredicate avec le format "SELF MATCHES %@" et une expression régulière pour la vérification de base du format. La vérification réelle de l'existence de l'email doit être effectuée sur le serveur. Pour une validation avancée, utilisez la bibliothèque SwiftValidators ou Combine publishers. Exemple : NSPredicate(format: "SELF MATCHES [c] %@", emailRegex).evaluate(with: email). La bordure du champ est mise à jour via un bloc d'animation pour une transition fluide.

func validateEmail(textField: UITextField) {
    guard let text = textField.text, !text.isEmpty else {
        textField.layer.borderColor = UIColor.clear.cgColor
        return
    }

    let emailRegex = "[A-Z0-9a-z._%+-]+@[A-Za-z0-9.-]+\\.\\p{L}{2,}"
    let predicate = NSPredicate(format: "SELF MATCHES [c] %@", emailRegex)
    let isValid = predicate.evaluate(with: text)

    UIView.animate(withDuration: 0.2) {
        textField.layer.borderColor = isValid
            ? UIColor.systemGreen.cgColor
            : UIColor.systemRed.cgColor
        textField.layer.borderWidth = 1.0
        textField.layer.cornerRadius = 6.0
    }
}