Flutter : comment activer / désactiver un bouton via onPressed ?
Le framework Flutter utilise des widgets que l'on gère via une relation parent-enfant. Cela permet de construire l'interface de son application. Un widget peut être un élément de texte, un bouton ou un container d'autres widgets, par exemple. Pour la gestion des boutons, Flutter fournit ses propres widgets que l'on peut manipuler. On peut ainsi facilement créer un bouton que va pouvoir désactiver quand on le souhaite.
Pour pouvoir activer puis désactiver un bouton, il faut utiliser l'évènement "onPressed". En effet, cet évènement est déclenché lors d'un clic (ou d'un appui avec le doigt) sur un bouton. Si l'on remplace la fonction de traitement par la valeur "null", alors le framework va automatiquement désactiver le bouton. Il faut une variable d'état qui va déterminer si le bouton est désactivé ou non. Nous allons donc pour cela utiliser un widget de type "Stateful". On peut ainsi utiliser un booléen. Il sera initialisé avec la méthode "initState()" lors de l'affichage du widget et se modifie avec la méthode "setState()". Pour terminer, affectez un opérateur ternaire à l'évènement "onPressed" de votre bouton. Si votre variable d'état indique que le bouton doit être désactivé, retournez "null". Sinon, vous pouvez appeler votre traitement.
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State {
//Variable d'état qui va permettre de désactiver le bouton
bool _desactive;
//À l'initialisation du bouton, celui-ci est actif
@override
void initState() {
_desactive = false;
}
//Action appelée lors du clic sur le bouton
void _actionPression() {
setState(() {
_desactive = true;
});
}
@override
Widget build(BuildContext context) {
return new RaisedButton(
child: new Text(
_desactive ? "Veuillez patienter..." : "Cliquez ici"
),
onPressed: _desactive ? null : _actionPression,
);
}
Vous pouvez également remplacer l'opérateur ternaire situé dans l'évènement "onPressed" et appeler directement une fonction. Ce sera alors à la fonction d'effectuer le test et de retourner "null" si le bouton doit être désactivé.