Why does my CupertinoActionSheet appear from the top?

Issue

Everything works fine, it’s just that the sheet appears at the top instead of the bottom. I would like the cupertinoactionsheet to appear from the bottom as default.

I’m currently using an Android emulator but I doubt it’s the reason why the sheet is appearing from the top.

Attached is my code

Future<bool> showReportDialog({
  @required BuildContext context,
}) async {
  return showCupertinoDialog(
    context: context,
    builder: (context) => CupertinoActionSheet(
      title: const Text('Make Your Space Safe',
          style: TextStyle(
              fontSize: 18, color: Colors.black, fontWeight: FontWeight.w600)),
      message: const Text('What to report this user for?',
          style: TextStyle(
              fontSize: 16.5,
              color: Colors.black38,
              fontWeight: FontWeight.w500)),
      actions: <CupertinoActionSheetAction>[
        CupertinoActionSheetAction(
          child: const Text(
            'Scam',
          ),
          onPressed: () {
            afterReport();
            print("Reported user for SCAM");
          },
        ),
        CupertinoActionSheetAction(
          child: const Text('Bots/Spam'),
          onPressed: () {
            afterReport();
            print("Reported user for BOTS/SPAM");
          },
        ),
        CupertinoActionSheetAction(
          child: const Text('Sexually harassing'),
          onPressed: () {
            afterReport();
            print("Reported user for SEXUALLY HARASSSING");
          },
        ),
        CupertinoActionSheetAction(
          child: const Text('Offensive/abusive behaviour'),
          onPressed: () {
            afterReport();
            print('Reported user for OFFENSIVE/ABUSIVE BEHAVIOUR');
          },
        ),
        CupertinoActionSheetAction(
          child: const Text('I want to write more',
              style: TextStyle(fontWeight: FontWeight.bold)),
          onPressed: () {
            Navigator.push(
                context,
                new MaterialPageRoute(
                    builder: (BuildContext context) => ReportUser()));
          },
        ),
        CupertinoActionSheetAction(
          child: const Text('Cancel'),
          onPressed: () {
            Navigator.pop(context);
          },
        )
      ],
    ),
  );
}

Solution

You need to use showCupertinoModalPopup instead of showCupertinoDialog:

showCupertinoModalPopup(
  context: context,
  builder: (context) => CupertinoActionSheet(
    title: const Text('Make Your Space Safe',
                      style: TextStyle(
                        fontSize: 18,
                        color: Colors.black,
                        fontWeight: FontWeight.w600)),
...

Answered By – Mobina

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.