web-dev-qa-db-fra.com

Flutter: bloc, comment afficher une boîte de dialogue d'alerte

Im nouveau dans le modèle de bloc et les trucs de flux. Je veux afficher une boîte de dialogue d’alerte lorsque j’appuie sur un bouton, mais je ne trouve aucun moyen de le faire. En fait, mon code est:

Widget button() {
  return RaisedButton(
      child: Text('Show alert'),
      color: Colors.blue[700],
      textColor: Colors.white,
      onPressed: () {
        bloc.submit();
      });
   }



return Scaffold(
        appBar: AppBar(
          title: Text("Title"),
        ),
        body: StreamBuilder(
            stream: bloc.getAlert,
            builder: (context, snapshot) {
              if (snapshot.hasData) {
                return Text("I have Dataaaaaa ${snapshot.data}");
              } else
                return ListView(
                  children: <Widget>[
                    Container(
                     button()
                    )
                ...

Et le BLoC:

final _submissionController = StreamController();
Stream get submissionStream=> _submissionController.stream;
Sink get submissionSink=> _submissionController.sink;

J'ai essayé de faire quelque chose comme:

Widget button() {
  return StreamBuilder(
stream: submissionStream
builder: (context, snapshot){
if (snapshot.hasData){
return showDialog(...)
}else
 return RaisedButton(
      child: Text('Show alert'),
      color: Colors.blue[700],
      textColor: Colors.white,
      onPressed: () {
        bloc.submit();
      });
   }

Mais, bien sûr, cela n'a pas fonctionné.

9
Little Monkey

Vous ne pouvez pas afficher une boîte de dialogue lorsque la construction fonctionne. Lorsque vous avez de nouvelles données, vous créez un nouveau widget. Probablement mieux pour vous n'utiliserez pas le flux dans ce cas, mais si nécessaire, vous devez utiliser

WidgetsBinding.instance.addPostFrameCallback ((_) => yourFunction (context));

ou

Future.microtask (() => showDialogFunction (context));

dans votre si

if (snapshot.hasData) { WidgetsBinding.instance.addPostFrameCallback((_) => showDialogFunction(context)); }

Ce code sera lancé après la méthode de construction, donc la boîte de dialogue s'affichera immédiatement.

La fonction Bloc renvoie toujours le widget, donc toujours le bouton () ou un wiget différent lorsque le flux contient des données

8
Mateusz

Voici ce que j'ai fait, cela pourrait être faux car je suis également nouveau dans le flottement. Mais fonctionne pour mon scénario.

Widget build(BuildContext context) {
final authBloc = BlocProvider.of<AuthBloc>(context);

authBloc.outServerResponse.listen((serverResponse) {
  if (serverResponse.status == 'success') {
    _navigateToLogin();
  } else {
    _showSnakBar(serverResponse.message);
  }
});
.... Rest of the code which returns the widget, 
which in my case is form widget with button for submitting as follows,
onPressed: () {
  if (_formKey.currentState.validate()) {
      _formKey.currentState.save();
      authBloc.processRegister.add(_registrationData.toMap());
  }
}

outServerResponse est le flux qui sort après la fin de l'API POST call.

authBloc.processRegister est le récepteur d'entrée pour transmettre les données du formulaire à mon fournisseur de services d'API Auth.

_nagivateToLogin & _showSnakBar sont des fonctions simples

_navigateToLogin() {
      Navigator.of(context).pop();
}

_showSnakBar(String msg) {
     Scaffold.of(context).showSnackBar(
      SnackBar(
        content: Text(msg),
      ),
     );
 }
2
blisssan