J'ai créé une boîte de dialogue qui s'affiche lorsqu'un numéro existe dans Firestore lors de l'enregistrement d'un nouvel utilisateur. Cependant, par défaut, Android semble positionner la boîte de dialogue au centre de l'écran. Existe-t-il un moyen de positionner la boîte de dialogue, disons à la position du widget dans lequel elle est appelée, pour mon cas, le bouton Raised rappelle. J'aimerais également savoir comment je peux afficher le message de validation dans un pop juste au-dessus d'un bouton,
Voici un exemple de mon code.
numberExistsDialog(BuildContext context) { var numberDialog = AlertDialog( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)), title: Text( 'Number Already Exists', style: TextStyle(color: Colors.red), textAlign: TextAlign.center, ), content: Text( 'Use another number', textAlign: TextAlign.center, ), ); showDialog( context: context, builder: (BuildContext context) { return numberDialog; });
}
3 Réponses :
Je ne sais pas si cela peut être fait avec le AlertDialog existant, mais j'ai une fois changé l'alignement de Dialog en créant une boîte de dialogue personnalisée.
Vous pouvez utiliser le widget Align
et aligner votre widget de dialogue selon vos besoins. Ici, dans l'exemple, je le bottomCenter
au bottomCenter
qui est Alignment(0, 1)
.
Exemple de code:
numberExistsDialog(BuildContext context) { var numberDialog = Align( alignment: Alignment(0, 1), child: Material( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)), child: Padding( padding: const EdgeInsets.all(32.0), child: Column( mainAxisSize: MainAxisSize.min, children: <Widget>[ Text( 'Number Already Exists', style: TextStyle(color: Colors.red), textAlign: TextAlign.center, ), Text( 'Use another number', textAlign: TextAlign.center, ), ], ), ), ), ); showDialog( context: context, builder: (BuildContext context) { return numberDialog; }, ); }
PS: Vous pouvez régler la TextStyle selon vos besoins en tant
AlertDialog
detitle
et lecontent
TextStyle est défini par défaut du Flutter lui - même.
ÉDITER:
Vous pouvez l'utiliser comme ci-dessous:
Align( alignment: Alignment(0, 1), child: Material( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)), child: Padding( padding: const EdgeInsets.all(32.0), child: Column( mainAxisSize: MainAxisSize.min, children: <Widget>[ Text( 'Number Already Exists', style: TextStyle(color: Colors.red), textAlign: TextAlign.center, ), Text( 'Use another number', textAlign: TextAlign.center, ), ], ), ), ), );
Vous devez le personnaliser par vous-même, voici un exemple de code. Ou utilisez simplement les packages. En voici un cool:
Capture d'écran:
Utilisez showGeneralDialog
qui sort de la boîte avec Flutter.
Scaffold( floatingActionButton: FloatingActionButton( child: Icon(Icons.add), onPressed: () { showGeneralDialog( context: context, barrierColor: Colors.black54, barrierDismissible: true, barrierLabel: 'Label', pageBuilder: (_, __, ___) { return Align( alignment: Alignment.bottomLeft, child: Container( color: Colors.blue, child: FlutterLogo(size: 150), ), ); }, ); }, ), )