Ankit
Ankit

Reputation: 679

Button not aligning to center in flutter AlertDialog

I am trying to use a alert dialog which has the button at the center, but the button keeps on displaying on the right side of the alert box.

Here is the code for alert box:

class Dialog extends StatelessWidget {

  String title;
  String content;

  Dialog(this.title, this.content);
  TextStyle textStyle = TextStyle (color: Colors.black);

  @override
  Widget build(BuildContext context) {
    return BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 6, sigmaY: 6),
        child:  AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius:
            BorderRadius.all(Radius.circular(10)),
          ),
          title: new Text(title,style: textStyle,),
          content: new Text(content, style: textStyle,),
          actions: <Widget>[
            Align(
              alignment: Alignment.center,
              child: RaisedButton(
                color: Colors.lightBlue[900],
                child: Text("OK"),
                onPressed: () {
                  Navigator.of(context).pop();
                },
              ),
            )
          ],
        ));
  }
}

Can someone help me getting this button at the center please?

Upvotes: 0

Views: 878

Answers (2)

Salim Murshed
Salim Murshed

Reputation: 1451

You can also set padding right and left of button like below.

class Dialog extends StatelessWidget {
  TextStyle textStyle = TextStyle(color: Colors.black);

  @override
  Widget build(BuildContext context) {
    return BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 6, sigmaY: 6),
        child: AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(Radius.circular(10)),
          ),
          title: new Text(
            "title",
            style: textStyle,
          ),
          content: new Text(
            "content",
            style: textStyle,
          ),
          actionsPadding: EdgeInsets.fromLTRB(100, 0, 100, 0),
          actions: <Widget>[
            RaisedButton(
              color: Colors.lightBlue[900],
              child: Text("OK"),
              onPressed: () {
                Navigator.of(context).pop();
              },
            )
          ],
        ));
  }
}

Upvotes: 0

Besufkad Menji
Besufkad Menji

Reputation: 1588

refactor your actions like this

actions: <Widget>[
                Container(
                  width: double.maxFinite,
                  alignment: Alignment.center,
                  child: RaisedButton(
                    color: Colors.lightBlue[900],
                    child: Text("OK"),
                    onPressed: () {
                      Navigator.of(context).pop();
                    },
                  ),
                )
              ],

Upvotes: 1

Related Questions