Create Pop-Up Dialog in Flutter

0
votes

I am needing a way to create a pop-up dialog in flutter.

The desired result would look like:

I have was able to create the 'two-toned' design as desired, and a dialog, but I am unable to find a way to pop-up the dialog once a user clicks a button to navigate to this screen.

Code for creating the view:

class CreateID extends StatelessWidget {
  const CreateID({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: cPrimaryColor,
      body: SafeArea(
        child: Column(
          children: [
            Expanded(
              child: Container(
                width: double.infinity,
              ),
            ),
            Expanded(
              child: Container(
                width: double.infinity,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(20.0),
                    topRight: Radius.circular(20.0)
                  )
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Here is the code for the dialog:

class PopUp extends StatelessWidget {
const PopUp({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) {
return Scaffold(
  body: SafeArea(
    child: FutureBuilder<dynamic>(
        future: showDialog(
            context: context,
            builder: (BuildContext context) {
              return AlertDialog(
                content: Stack(
                  overflow: Overflow.visible,
                  children: <Widget>[
                    Positioned(
                      right: -40.0,
                      top: -40.0,
                      child: InkResponse(
                        onTap: () {
                          Navigator.of(context).pop();
                        },
                        child: CircleAvatar(
                          child: Icon(Icons.close),
                          backgroundColor: Colors.red,
                        ),
                      ),
                    ),
                    Form(
//key: _formKey,
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          Padding(
                            padding: EdgeInsets.all(8.0),
                            child: TextFormField(),
                          ),
                          Padding(
                            padding: EdgeInsets.all(8.0),
                            child: TextFormField(),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              );
            }),
        builder: (BuildContext context, AsyncSnapshot<dynamic> 
snapshot) {
          throw UnimplementedError;
        }),
  ),
);
}
}

The ideal result would be when the user is 'pushed' (by clicking a button) to the CreateID screen, it would popup the dialog.

flutterdialogpopup