How to customize a dialog's position, size and background?

Question

I have a home screen with a FAB and when it's pressed I want to display a dialog for user to input.

Currently I am using showDialog() with SimpleDialog.

showDialog(
  context: context,
  builder: (BuildContext context) {
    return SimpleDialog(
      title: NormalText('New Counter Item'),
      contentPadding: EdgeInsets.fromLTRB(24.0, 0.0, 24.0, 24.0),
      children: <Widget>[
        Container(
          ...
        )
      ],
    );
  }
);

But, I can't seem to customise almost anything with it (smaller, corner-curved and positioned lower on the screen). AlertDialog seems to be the same.

Is there anyway to customise those attributes?

Answer 1

return showDialog<void>(
      barrierDismissible: true,
      context: context,
      builder: (BuildContext context) {
        return new Column(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(0),
              child: new Container(
                height: 100,
                width: MediaQuery.of(context).size.width,
                color: Colors.purple,
                child: new Column(
                  children: <Widget>[
                    new Text(
                      'custom dialog text',
                      style: new TextStyle(
                        fontSize: 14,
                        color: Colors.white,
                      ),
                    ),
                  ],
                ),
              ),
            )
          ],
        );
      },
    );

hope this helps, thanks