dart - Flutter: change the width of an AlertDialog

Question

I wonder how to change the default width of an AlertDialog, I only succeeded to change the border radius :

Here is my code :

showDialog(
       context: context,
       builder: (_) =>
            new AlertDialog(
               shape: RoundedRectangleBorder(
                   borderRadius: BorderRadius.all(Radius.circular(10.0))
               ),
               content: ProductPreviewScreen(),
            )
    );

Result expected :

Any idea?

Answer 1

As of May 2020, if you want to change the inset padding of a dialog, all you have to do is use the Dialog class and override the 'insetPadding' property. You can make a dialog extend all the way to the screen edges if you want to.

You can also make some cool custom dialogs by making the dialog surface itself transparent and then add whatever widgets you want. For example:

showDialog(Dialog(
  backgroundColor: Colors.transparent,
  insetPadding: EdgeInsets.all(10),
  child: Stack(
    overflow: Overflow.visible,
    alignment: Alignment.center,
    children: <Widget>[
      Container(
        width: double.infinity,
        height: 200,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(15),
          color: Colors.lightBlue
        ),
        padding: EdgeInsets.fromLTRB(20, 50, 20, 20),
        child: Text("You can make cool stuff!",
          style: TextStyle(fontSize: 24),
          textAlign: TextAlign.center
        ),
      ),
      Positioned(
        top: -100,
        child: Image.network("https://i.imgur.com/2yaf2wb.png", width: 150, height: 150)
      )
    ],
  )
));

Results in: