GetX est une puissante librairie pour le développement avec Flutter. Celle-ci contient différents modules : un gestionnaire d'état, un système d'injection de dépendance, un gestionnaire de navigation, etc. dont le but est d'accroître la productivité du développeur.
Dans ce billet de blog, nous présenterons le module de navigation. Elle constitue un élément essentiel à la réalisation d'une application. Nous mettons en place différentes interfaces et transitions entre elles. Le système de navigation actuel demande d'écrire beaucoup de code. Nous verrons l'alternative plus simple proposée par GetX.
Installation
Pour installer GetX, il faut définir la dépendance dans le fichier pubspec.yaml
.
dependencies:
get:
Utilisation
Pour que GetX soit pris en compte dans notre application, il faudra remplacer MaterialApp
par GetMaterialApp
comme suit :
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
...,
);
}
}
Passez d'une page à une autre
Sans GetX, elle se fait de la manière suivante:
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => MainPage(),
),
);
Avec GetX, l'approche est très différente et se fait ainsi:
Get.to(MainPage());
Vous remarquez l'absence du context
. GetX sait le récupérer en toute transparence.
Passez d'une page à une autre en détruisant la précédente
Sans GetX
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (context) => MainPage(),
),
);
Avec GetX
Get.off(Page());
Passez à une page en détruisant toutes les précédentes
Sans GetX
Navigator.of(context).pushAndRemoveUntil(
MaterialPageRoute(
builder: (context) => MainPage(),
),
(route) => false,
);
Avec GetX
Get.offAll(Page());
Nous constatons le gain de production apportée par cette librairie. Pour plus d'informations concernant la navigation, vous pouvez consulter la documentation ici.
Cordialement.