Is there any way to make a common class for alert dialogues in flutter?

Question

Is it possible to make a common class to show pop up (alert dialogues) in flutter. If so please help me with an example.

Answer 1

create popups.dart

inside your popups.dart

void showYourPopUp(context){
  showDialog(
    context: context,
    builder: (_)=> AlertDialog(
      backgroundColor: Colors.transparent,
      content: BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 4.0,sigmaY:4.0) //this is for background blur only you can remove BackdropFilter if you want
       child: *your popup design*
      )
    )
  );
}

then import popups.dart in the class you want to use it e.g

this is your main.dart

import "your_app/popups.dart"

how to use:

GestureDetector(
  onTap(){
    showYourPopUp(context);
  }
)

Answer 2

Here is the dialog class you can use- DeleteHomeDialog will be the common class

onTap: (){
    showDeleteDialog();
}

 showDeleteDialog() {
    showDialog(
      context: context,
      builder: (BuildContext context) =>
          DeleteHomeDialog(),
    );
  }

and,

class DeleteHomeDialog extends StatelessWidget {
  DeleteHomeDialog();

  @override
  Widget build(BuildContext context) {

    dialogContent(BuildContext context) {
      return Stack(
        children: <Widget>[
          Container(
            padding: EdgeInsets.fromLTRB(10, 15, 10, 10),
            margin: EdgeInsets.only(top: 10),
            decoration: new BoxDecoration(
              color: Colors.white,
              shape: BoxShape.rectangle,
              borderRadius: BorderRadius.circular(10),
              boxShadow: [
                BoxShadow(
                  color: Colors.black26,
                  blurRadius: 10.0,
                  offset: const Offset(0.0, 10.0),
                ),
              ],
            ),
            child: new Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Text("Alert", style: TextStyle(color: Colors.red, fontSize: 18, fontWeight: FontWeight.bold),),
                Container(margin: EdgeInsets.fromLTRB(10, 15, 10, 0),
                  child: Text("Are you sure you want to delete ?", style: TextStyle(color: Colors.red, fontSize: 18),),
                ),
                Container(
                  margin: EdgeInsets.all(20),
                  child: RaisedButton(
                    child: Text("Cancel"),
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    color: Colors.red,
                    textColor: Colors.white,
                    padding: EdgeInsets.fromLTRB(20, 12, 20, 12),
                    splashColor:Colors.red,
                    shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
                  ),
                )
              ],
            ),
          )
        ],
      );
    }

    return Dialog(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(10),
      ),
      elevation: 0.0,
      backgroundColor: Colors.transparent,
      child: dialogContent(context),
    );
  }
}