Image de l'article Concepts avancés de Dart : navigation et itinéraires

4.10. Concepts avancés de Dart : navigation et itinéraires

Page 48 | Écouter en audio

La programmation Dart, en particulier lorsqu'elle est utilisée conjointement avec Flutter, offre un certain nombre de fonctionnalités avancées qui vous permettent de créer des applications robustes et hautement interactives. L’un de ces concepts avancés est la navigation et le routage. En comprenant le fonctionnement de la navigation et du routage dans Dart et Flutter, vous pouvez créer des applications avec plusieurs écrans et une expérience utilisateur fluide et intuitive.

Dans Dart et Flutter, un itinéraire est simplement un écran ou une page dans une application. La navigation fait référence au processus de déplacement entre différents itinéraires. Ceci est similaire à la façon dont vous naviguez sur un site Web, en cliquant sur des liens pour passer de page en page. Cependant, au sein d'une application, la navigation est souvent plus complexe, impliquant des animations et des transitions, et peut même inclure le passage de données d'un écran à un autre.

Pour démarrer avec la navigation et le routage dans Dart et Flutter, vous devez d'abord comprendre le concept de « Navigateur ». Le Navigateur est un widget qui gère une pile d'objets Route. Vous pouvez le considérer comme un navigateur Web qui conserve un historique des pages que vous avez visitées. Vous pouvez « pousser » de nouveaux itinéraires sur la pile pour accéder à un nouvel écran, et « extraire » des itinéraires de la pile pour revenir à l'écran précédent.

Pour définir un itinéraire dans Flutter, vous devez créer un widget qui représente cet itinéraire. Par exemple, vous pouvez créer un widget appelé « HomeScreen » pour l'écran d'accueil de votre application. Pour accéder à cet écran, vous pouvez « pousser » l'itinéraire dans le navigateur. Voici un exemple de la façon dont cela peut être réalisé :

Navigator.push(context, MaterialPageRoute(builder: (context) => HomeScreen()));

Dans cet exemple, « contexte » est un objet qui contient des informations sur l'emplacement du widget dans l'arborescence des widgets. « MaterialPageRoute » est un type d'objet Route qui utilise une animation de transition appropriée pour les plates-formes qui suivent les directives de conception Material.

Pour revenir à l'écran précédent, vous pouvez « extraire » l'itinéraire actuel de la pile. Voici un exemple de la façon dont cela peut être réalisé :

Navigateur.pop (contexte);

Vous pouvez également transmettre des données d'un itinéraire à un autre. Pour ce faire, vous pouvez transmettre les données sous forme d'arguments au constructeur du widget d'itinéraire. Par exemple, si vous souhaitez transmettre une chaîne d'un écran à un autre, vous pouvez faire quelque chose comme ceci :

Navigator.push(context, MaterialPageRoute(builder : (context) => DetailScreen(data : 'Bonjour')));

Ensuite, dans le widget DetailScreen, vous pouvez accéder aux données transmises à l'aide de « widget.data ».

De plus, Flutter prend également en charge la définition d'itinéraires nommés. Cela vous permet de définir tous vos itinéraires en un seul endroit et d'y accéder en utilisant leurs noms. Pour définir des routes nommées, vous pouvez utiliser le paramètre 'routes' du widget MaterialApp ou CupertinoApp. Voici un exemple de la façon dont cela peut être réalisé :

MatérielApp ( itinéraires : { '/' : (contexte) => HomeScreen(), '/detail' : (contexte) => DetailScreen(), }, );

Pour naviguer vers un itinéraire nommé, vous pouvez utiliser la méthode 'Navigator.pushNamed()'. Voici un exemple de la façon dont cela peut être réalisé :

Navigator.pushNamed(contexte, '/detail');

En résumé, la navigation et le routage constituent un aspect crucial du développement d'applications dans Dart et Flutter. En comprenant leur fonctionnement, vous pouvez créer des applications avec plusieurs écrans et une expérience utilisateur intuitive.

Répondez maintenant à l’exercice sur le contenu :

Qu’est-ce que la navigation et le routage dans Dart et Flutter ?

Tu as raison! Félicitations, passez maintenant à la page suivante

Vous avez raté! Essayer à nouveau.

Image de l'article Concepts avancés de Dart : persistance des données

Page suivante de lebook gratuit :

49Concepts avancés de Dart : persistance des données

3 minutes

Obtenez votre certificat pour ce cours gratuitement ! en téléchargeant lapplication Cursa et en lisant lebook qui sy trouve. Disponible sur Google Play ou App Store !

Get it on Google Play Get it on App Store

+ 6,5 millions
d'étudiants

Certificat gratuit et
valide avec QR Code

48 mille exercices
gratuits

Note de 4,8/5 dans les
magasins d'applications

Cours gratuits en
vidéo, audio et texte