1. Le modèle de pile d’écrans du Navigator

Dans les applications mobiles, la navigation fonctionne selon une pile ordonnée (Last In, First Out). Lorsqu’un utilisateur clique sur un élément pour voir son détail, la nouvelle page est empilée au-dessus de la précédente (Navigator.push). Lors de l’appui sur le bouton retour tactile ou la flèche de l’AppBar, la page courante est dépilée et détruite (Navigator.pop).

2. Navigation déclarative et routes nommées

Pour clarifier la maintenance des écrans dans une application de grande taille, configurez une table de routes dans votre MaterialApp :

void main() {
    runApp(MaterialApp(
        initialRoute: '/',
        routes: {
            '/': (context) => const EcranAccueil(),
            '/catalogue': (context) => const EcranCatalogueCours(),
            '/details': (context) => const EcranDetailCours(),
        },
    ));
}

// Déclenchement de la transition avec transmission d'arguments
Navigator.pushNamed(
    context, 
    '/details', 
    arguments: {'id_cours': 'FLUTTER-01', 'titre': 'Développement Mobile'}
);

3. Récupération des paramètres de route

La page cible extrait les arguments transmis à travers le contexte de construction : ModalRoute.of(context)!.settings.arguments as Map<String, dynamic>.

Synthèse pédagogique : Maîtriser la pile de navigation évite les fuites de mémoire provoquées par l’empilement incontrôlé d’écrans successifs.

PreviousNext