TP2 - Les bases de Flutter et des widgets

cette activité est de découvrir la structure de base d’une application Flutter et de créer une première interface simple.

Projet 1 Débutant 0(0 Notes) 0 Élèves inscrits French
Créé par Nassira Barhoumi
Dernière mise à jour Sun, 25-Oct-2026
+ Voir plus
Aperçu du cours

cette activité est de découvrir la structure de base d’une application Flutter et de créer une première interface simple.

Au programme :

  • Activité 1 : Ajouter un AppBar (5 min)
  • Activité 2 : Ajouter le texte (5 min)
  • Activité 3 : Le widget Container (5 min)
  • Activité 4 : Container — suite du code (5 min)
  • Activité 5 : Changer l’arrière-plan — Étape 1 (5 min)
  • Activité 6 : Changer l’arrière-plan — Étape 2 · Changer l’arrière-plan — Étape 3 (5 min)
  • Activité 7 : Changer l’arrière-plan — Étape 3 · Ajouter une zone de texte devant un label (5 min)
  • Activité 8 : Ajouter une zone de texte devant un label · Structure générale du code · Le widget Row en détail (5 min)
  • Activité 9 : Code complet de l’écran · Ajouter un bouton (5 min)
  • Activité 10 : Ajouter un bouton · Structure générale du code · Style du bouton (5 min)
  • Activité 11 : Code complet du bouton · Mini-projet : formulaire complet (5 min)
  • Activité 12 : Mini-projet — code complet · Point d’entrée de l’application · État de l’écran (HomeScreen) (5 min)
  • Activité 13 : Mini-projet — code complet · Conteneur et colonne du formulaire · Champ de saisie « Nom » (5 min)
  • Activité 14 : Mini-projet — code complet · Espacement et ligne « Prénom » · Champ de saisie « Prénom » (5 min)
  • Activité 15 : Mini-projet — code complet · Ligne « Âge » (clavier numérique) · Ligne « Email » (10 min)
  • Activité 16 : Mini-projet — code complet · Bouton « Valider » et message · Style du texte et fin du widget (10 min)

Durée : 1h30 (1 séance de 1h30) · Master 2

Ce que vous allez apprendre?

  • Ajouter un AppBar
  • Ajouter le texte
  • Le widget Container
  • Container — suite du code
  • Changer l’arrière-plan — Étape 1
  • Changer l’arrière-plan — Étape 2 · Changer l’arrière-plan — Étape 3
  • Changer l’arrière-plan — Étape 3 · Ajouter une zone de texte devant un label
  • Ajouter une zone de texte devant un label · Structure générale du code · Le widget Row en détail
  • Code complet de l’écran · Ajouter un bouton
  • Ajouter un bouton · Structure générale du code · Style du bouton
  • Code complet du bouton · Mini-projet : formulaire complet
  • Mini-projet — code complet · Point d’entrée de l’application · État de l’écran (HomeScreen)
  • Mini-projet — code complet · Conteneur et colonne du formulaire · Champ de saisie « Nom »
  • Mini-projet — code complet · Espacement et ligne « Prénom » · Champ de saisie « Prénom »
  • Mini-projet — code complet · Ligne « Âge » (clavier numérique) · Ligne « Email »
  • Mini-projet — code complet · Bouton « Valider » et message · Style du texte et fin du widget
Prérequis
Programme de ce cours
19 Leçons 02:20:00 heures
TP2 - Les bases de Flutter et des widgets
19 Leçons 02:20:00 heures
  • Activité 1 : Ajouter un AppBar
    0:05:00
  • Activité 2 : Ajouter le texte
    0:05:00
  • Activité 3 : Le widget Container
    0:05:00
  • Activité 4 : Container — suite du code
    0:05:00
  • Activité 5 : Changer l’arrière-plan — Étape 1
    0:05:00
  • Activité 6 : Changer l’arrière-plan — Étape 2 · Changer l’arrière-plan — Étape 3
    0:05:00
  • Activité 7 : Changer l’arrière-plan — Étape 3 · Ajouter une zone de texte devant un label
    0:05:00
  • Activité 8 : Ajouter une zone de texte devant un label · Structure générale du code · Le widget Row en détail
    0:05:00
  • Activité 9 : Code complet de l’écran · Ajouter un bouton
    0:05:00
  • Activité 10 : Ajouter un bouton · Structure générale du code · Style du bouton
    0:05:00
  • Activité 11 : Code complet du bouton · Mini-projet : formulaire complet
    0:05:00
  • Activité 12 : Mini-projet — code complet · Point d’entrée de l’application · État de l’écran (HomeScreen)
    0:05:00
  • Activité 13 : Mini-projet — code complet · Conteneur et colonne du formulaire · Champ de saisie « Nom »
    0:05:00
  • Activité 14 : Mini-projet — code complet · Espacement et ligne « Prénom » · Champ de saisie « Prénom »
    0:05:00
  • Activité 15 : Mini-projet — code complet · Ligne « Âge » (clavier numérique) · Ligne « Email »
    0:10:00
  • Activité 16 : Mini-projet — code complet · Bouton « Valider » et message · Style du texte et fin du widget
    0:10:00
  • Activité supplémentaire 1 : Ma carte de visite Flutter
    0:20:00
  • Activité supplémentaire 2 : Le compteur de clics
    0:30:00
  • Quiz de fin de TP
    0:00:00
+ Voir plus
Autres cours associés
02:20:00 heures
Mis à jour Sun, 25-Oct-2026
0 0
02:20:00 heures
Mis à jour Sun, 25-Oct-2026
0 0
02:20:00 heures
Mis à jour Sun, 25-Oct-2026
0 0
02:20:00 heures
Mis à jour Sun, 25-Oct-2026
0 0
À propos du formateur

Nassira Barhoumi

0 Avis | 0 Etudiants | 213 Cours
Avis des élèves
0
0 Avis
  • (0)
  • (0)
  • (0)
  • (0)
  • (0)

Avis

TP complet :
ت.د 32
16 activités × ت.د 2
Accès en ligne jusqu'au 31/08/2027
Le certificat est délivré pour un TP acheté en entier (TP complet ou niveau).

Comprend:
Inscriptions en ligne bientôt ouvertes — écrivez-nous à contact@tunarco.fr Inscription au présentiel ouverte →