TP9 Créer et valider un formulaire d’inscription avec Flutter

TP9 Créer et valider un formulaire d’inscription avec Flutter

1. Objectif

• Vous serez capable de créer et valider un TextFormField dans Flutter.

2. Instructions

• Répondez aux questions en respectant les consignes. Suivez chaque étape pour construire un formulaire fonctionnel en Flutter avec les validations spécifiées.
• Assurez-vous de tester chaque validation et d’obtenir un formulaire conforme au modèle présenté dans la capture d’écran fournie.
• Question 1 :
• Dans l’application Flutter, créez un champ de formulaire pour saisir le nom de l’utilisateur. Assurez-vous d’ajouter une validation qui vérifie que le champ n’est pas vide. Si le champ est vide, un message d’erreur doit indiquer : « Veuillez entrer un nom valide ».
• Question 2 :
• Créez un champ de formulaire pour le numéro de téléphone de l’utilisateur.
• Ajoutez une validation pour vous assurer que le numéro est composé de 8 chiffres exactement. Si le champ est vide ou contient un nombre incorrect de chiffres, un message d’erreur doit afficher : « Le numéro de téléphone doit contenir exactement 8 chiffres ».
• Configurez le keyboardType sur TextInputType.phone pour afficher un clavier numérique.
• Question 3 :
• Créez un champ de formulaire pour l’adresse email de l’utilisateur.
• Implémentez la validation de l’email. Assurez-vous que l’adresse email saisie soit dans un format valide. Utilisez l’expression régulière suivante pour la validation :

RegExp(r'^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$').hasMatch(value))

• Si le format est incorrect, le message d’erreur suivant doit apparaître : « Adresse email invalide ». Assurez-vous que le champ accepte uniquement des adresses email valides.
• Configurez le keyboardType sur TextInputType.emailAddress pour afficher un clavier optimisé pour la saisie d’emails.
• Question 4 :
• Ajoutez un champ pour la date de naissance de l’utilisateur. Le champ doit accepter une date au format JJ/MM/AAAA. La validation doit vérifier que l’utilisateur a au moins 18 ans. Si l’utilisateur n’a pas l’âge requis, affichez un message d’erreur : « Vous devez avoir au moins 18 ans ».
• Configurez le keyboardType sur TextInputType.datetime pour afficher un clavier adapté à la saisie de dates.
• Question 5 :
• Ajoutez un bouton intitulé Valider qui, lorsqu’il est pressé, vérifie la validité de chaque champ du formulaire. Si tous les champs sont correctement remplis, un message doit indiquer : « Données valides ! ». Si une ou plusieurs validations échouent, un message d’erreur doit indiquer : « Erreur de validation ».
• Question 6 :
• Expliquez en quelques lignes le rôle et l’utilisation de GlobalKey dans le code du formulaire Flutter. Pourquoi cette clé est-elle importante pour la validation de formulaires en Flutter ?
• Question 7 :
• Décrivez les étapes pour valider un champ de formulaire en Flutter en utilisant la méthode validator. Comment la fonction validate() utilise-t-elle ces méthodes pour vérifier chaque champ ?
• Question 8 :
• Observez la capture d’écran fournie qui montre le résultat attendu. Reproduisez cette interface dans votre application en Flutter. Assurez-vous que toutes les validations fonctionnent comme spécifié et que l’interface du formulaire correspond à celle de la capture.



3. Barème :

• Chaque question est notée sur 2 points, et 4 points supplémentaires seront alloués pour le design de l’interface.