如何使警报对话框在颤动中工作答案

【问题标题】：How to make Alert Dialog working in flutter如何使警报对话框在颤动中工作
【发布时间】：2020-10-08 05:22:36
【问题描述】：

我正在使用下面的代码注册用户，有一个上传图片的选项，如果它是 null 用户将不会被注册，那是正确的，我唯一面临的是如果图片是@ 987654322@ 它应该向用户发出警报对话框，但警报对话框根本不起作用。我应该如何实现警报对话框？

if (avatarImageFile != null ) {
                  FirebaseAuth.instance
                      .createUserWithEmailAndPassword(
                      email: emailInputController.text,
                      password: pwdInputController.text)
                      .then((currentUser) =>

                      Firestore.instance
                          .collection("users")
                          .document(currentUser.user.uid)
                          .setData({
                        "username": userNameInputController.text,
                        "email": emailInputController.text,
                      })
                          .then((result) =>
                      {

                      uploadFile(currentUser.user.uid),

                      print(currentUser.user.getIdToken()),
                        currentUser.user.sendEmailVerification(),
                        Navigator.pushAndRemoveUntil(
                            context,
                            MaterialPageRoute(
                                builder: (context) =>
                                    MainScreen(
                                    )),
                                (_) => false),
                      })
                          .catchError((err) => print(err)))
                      .catchError((err) => print(err));

                }
                else {
                  print("Please Upload the Image");
                  AlertDialog(
                          title: Text("Image Required"),
                          content: Text("Please upload the image"),
                          actions: <Widget>[
                            FlatButton(
                              child: Text("Close"),
                              onPressed: () {
                                Navigator.of(context).pop();
                              },
                            )
                          ],
                        );
                }

【问题讨论】：

您可以为警报对话框创建一个单独的 dart 类，然后在整个应用程序中使用它。你可以看看这个帖子arkapp.medium.com/…

标签： flutter dart flutter-alertdialog

【解决方案1】：

您需要使用函数showDialog，这样对话框才会出现：

else {
   print("Please Upload the Image");
     showDialog(
     context: context,
     builder: (BuildContext context) {
         return AlertDialog(
                 title: Text("Image Required"),
                 content: Text("Please upload the image"),
                  actions: <Widget>[
                   FlatButton(
                     child: Text("Close"),
                     onPressed: () {
                      Navigator.of(context).pop();
                      },
                   )
                  ],
                );
               };
             );
           }

【讨论】：

【解决方案2】：

Peter Haddad 的回答解决了这个问题，但我建议将 AlertDialog 放置在小部件中，以便再次重用 AlertDialog。这是我为我的项目做的：

Dialogs.dart：

import 'package:flutter/material.dart';

enum alertDialogAction { cancel, save }

class Dialogs {
  static Future<alertDialogAction> alertDialog(
    BuildContext context,
    String title,
    String body,
    String cancel,
    String save,
  ) {
    Future<alertDialogAction> action = showDialog(
        context: context,
        barrierDismissible: true,
        builder: (BuildContext context) {
          return AlertDialog(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(10),
            ),
            title: Text(title),
            content: Text(body),
            actions: <Widget>[
              FlatButton(
                  onPressed: () =>
                      Navigator.pop(context, alertDialogAction.cancel),
                  child: Text(cancel)),
              RaisedButton(
                  color: Colors.orange,
                  onPressed: () =>
                      Navigator.of(context).pop(alertDialogAction.save),
                  child: Text(
                    save,
                    style: TextStyle(color: Colors.white),
                  )),
            ],
          );
        });
    return (action != null) ? action : alertDialogAction.cancel;
  }

你可以这样称呼它：

onPressed:() async {
   final action= await Dialogs.alertDialog(context,"Title","Body","Cancel","Save");
   //cancel and save are the button text for cancel and save operation
   if(action==alertDialogAction.save){
     //do something
     Navigator.pop(context);
   }
}

【讨论】：

【解决方案3】：

你也可以使用脚手架显示一个对话框，例如，

Scaffold.of(context).showSnackBar(SnackBar(content: AlertDialog(content: Text('Alert!!!'))));

但是你必须记住，上下文应该是当前脚手架的。因此，您可能希望将 body 属性（在 Scaffold 中）包装在 Builder 小部件中，然后当您在该构建器小部件中使用上下文时，该上下文将是当前脚手架。

【讨论】：

【解决方案4】：

showDialog(
     context: context,
     builder: (BuildContext context) {
         return AlertDialog(
                 title: Text("Your Title!!!"),
                 content: Text("Your Content!!!"),
                  actions: <Widget>[
                   FlatButton(
                     child: Text("Close"),
                     onPressed: () {
                      Navigator.of(context).pop();
                      },
                   )
                  ],
                );
               };
             );

【讨论】：