Flutter : Comment modifier la largeur d'un AlertDialog ?

Question

Je me demande comment changer la largeur par défaut d'un AlertDialog, je n'ai réussi qu'à changer le rayon de la bordure :

Voici mon code :

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

Résultat attendu :

Any idea?

Answer 1

return Dialog(
      insetPadding: EdgeInsets.symmetric(
        horizontal: X,
      ),
);

Answer 2

J'ai trouvé le moyen le plus simple... il suffit d'ajouter insetPadding: EdgeInsets.zero, et il s'étendra à la largeur maximale :

 showDialog(
          context: context,
          builder: (BuildContext context) {
            return AlertDialog(
              title: Center(child: Text("Send Message", style: TextStyle(
                  color: Colors.white, fontWeight: FontWeight.bold),)),
              backgroundColor: Colors.indigo[700],
              insetPadding: EdgeInsets.zero,
              content:

Answer 3

J'utilise obtenir et c'est merveilleux. Utilisez son dialogue, sa capacité à s'adapter facilement.

Get.generalDialog(pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation,) {
      return SimpleDialog(
        shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(Constants.padding), ),
        elevation: 0, backgroundColor: Colors.transparent,
        children: [Center(child: Stack(
          children: <Widget>[
            Container(width: Get.width * 0.95,
              padding: const EdgeInsets.only(left: Constants.padding,top: Constants.avatarRadius
                  + Constants.padding, right: Constants.padding,bottom: Constants.padding
              ),
              margin: const EdgeInsets.only(top: Constants.avatarRadius),
              decoration: BoxDecoration(
                shape: BoxShape.rectangle,
                color: Get.theme.scaffoldBackgroundColor,
                borderRadius: BorderRadius.circular(Constants.padding),
                boxShadow: const [
                  BoxShadow(color: Colors.black,offset: Offset(0,10), blurRadius: 10 ),
                ]
              ),
              child: Text('body'),
            ),
            Positioned(
              left: Constants.padding, right: Constants.padding,
              child: CircleAvatar(
                backgroundColor: Colors.blueAccent, radius: Constants.avatarRadius,
                child: ClipRRect(
                  borderRadius: const BorderRadius.all(Radius.circular(Constants.avatarRadius)),
                  child: Icon(Icons.done, size: 24, color: Colors.white,)
                ),
              ),
            ),
            Positioned(
              left: 0,
              //right: Constants.padding,
              child: CircleAvatar(
                backgroundColor: Colors.blueAccent, radius: Constants.avatarRadius,
                child: ClipRRect(
                  borderRadius: const BorderRadius.all(Radius.circular(Constants.avatarRadius)),
                  child: InkWell(child: const Icon(Icons.close, size: 24, color: Colors.white,), onTap: (){Get.back();},)
                ),
              ),
            ),
          ],
        ))],
      );
    }, barrierDismissible: true, barrierLabel: '');

Answer 4

/// cela fonctionne pour moi passez votre corps et voyez le résultat

Future _showDialog() async { return showDialog( contexte : contexte,

barrierDismissible: true,
builder: (BuildContext context) {
  return Center(
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        Material(
          color: Colors.transparent,
          child: Container(
            padding: EdgeInsets.fromLTRB(5, 10, 5, 10),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(5),
            ),
            alignment: Alignment.center,
            width: MediaQuery.of(context).size.width,
            margin: EdgeInsets.all(10),
            /// paste your item body 
            child:body,
          ),
        ),
      ],
    ),
  );
},

) ; }

Answer 5

Dans mon cas, j'utilisais une vue de liste à l'intérieur de la boîte de dialogue, donc je n'utilisais pas la fonction l'enveloppe rétractable à l'intérieur de ListView ; j'espère que cela pourra aider quelqu'un.

ListView.builder(
shrinkWrap : true...
...
};