Flutter bottom aligned overlay

Question

I am trying to build a layout, where, when a button is pressed an overlay animates from the bottom of the screen upwards. It should use max half of the screen and contains a list of Items (represented as text lines), the user can pick with a tab. I tried to use dialogs, but I can't seem to align the dialog in the bottom half oh the screen.

How would I approach this?

Basically:

When pressed on the Select button, an overlay is animated over the bottom half of the screen. When an option is selected, the overlay closes.

Answer 1

Try to use bottomsheet dialog:

showModalBottomSheet(
      context: context,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(
          top: Radius.circular(20),
        ),
      ),
      clipBehavior: Clip.antiAliasWithSaveLayer,
      builder: (BuildContext context) {
        return Container(//your other widgets);
      },
    );