Question 343367 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter: Get.back() not closing AlertDialog when using PopScope in GetX

I recently migrated from WillPopScope to PopScope due to the deprecation of the former in Flutter. I am using GetX for state management and navigation in my Flutter app. After switching to PopScope, I encountered an issue where the Get.back() method does not close the AlertDialog but instead navigates back to the previous page. This behavior is not what I intended, and I’m looking for a solution to properly handle the back action to close the dialog instead of navigating away.

Flutter Environment:

Flutter (Channel stable, 3.16.9, on macOS 14.3.1 23D60 darwin-arm64, locale en-TR)
Android toolchain - develop for Android devices (Android SDK version 33.0.0)
Xcode - develop for iOS and macOS (Xcode 15.2)
Chrome - develop for the web
Android Studio (version 2023.1)
VS Code (version 1.86.2)
Connected device (3 available)

GetX Version:

get: ^4.6.6

Original Code with WillPopScope:

WillPopScope(
  onWillPop: () async {
    if (controller.selectedReasons.isNotEmpty) {
      _superDialogController.show(
        title: 'Do you want to exit?',
        description: 'If you exit, the report will not be sent to us.',
        primaryOption: AlertDialogButton(
          text: 'Stay',
          onTap: () async {
            Get.back();
          },

        ),
        secondaryOption: AlertDialogButton(
          text: 'Back',
          onTap: () async {
            controller.selectedReasons.clear();
            Get.back();
            Get.back();
          },

        ),
      );
    }
    return Future.value(true);
  },
  child: Scaffold(),
)

Migrated Code with PopScope:

PopScope(
        canPop: controller.selectedReasons.isEmpty,
        onPopInvoked: (didPop) async {
          if (didPop) {
            return;
          }
          await _superDialogController.show(
            title: 'Do you want to exit?',
            description: 'If you exit, the report will not be sent to us.',
            primaryOption: AlertDialogButton(
              text: 'Stay',
              onTap: () async {
                Get.back(); // <- I hope it closes the AlertDialog
              },
            ),
            secondaryOption: AlertDialogButton(
              text: 'Back',
              onTap: () async {
                controller.selectedReasons.clear();
                Get.back(); // <- I hope it closes the AlertDialog
                Get.back(); // <- I hope it goes to the previous screen
              },
            ),
          );
        },
        child: Scaffold(),

What I’ve tried:

  • Double-checking the logic within onPopInvoked to ensure Get.back() is called correctly.
  • Searching for similar issues or documentation regarding PopScope behavior with dialogs in GetX.

What am I expecting?

First closing the AlertDialog and then moving to the previous screen correctly.

This is exactly what happens with the code I have:

AlertDialog does not close, and the screen behind moves to the previous screen. But the AlertDialog is still on the screen. I click somewhere else to close it.

Does anyone have suggestions on how to correctly close the dialog without navigating away from the current page using PopScope and GetX? Any insights or solutions would be greatly appreciated.

Tags:

2

Answers


  1. 0

    you did not show some code about it, but I have some answer, please try :

    1)

    showDialog(
  context: context,
  barrierDismissible: false,
  builder: (BuildContext context) {
    return WillPopScope(
      onWillPop: () async => false, // False will prevent and true will allow to dismiss
      child: AlertDialog(
        title: Text('Title'),
        content: Text('This is Demo'),
        actions: <Widget>[
          FlatButton(
            onPressed: () => Navigator.pop(context),
            child: Text('Go Back'),
          ),
        ],
      ),
    );
  },
);

    1. did you try this :

      Get.back(closeOverlays: true);

    2. Get.bottomSheet(
      WillPopScope(
      onWillPop: () async {
      Get.back(closeOverlays: true);
      return false;
      },
      child: const QuestionWidget(),
      );

    Login or Signup to reply.
  2. 0

    In your code, you’re using the Get.back() method to navigate back. However, it’s not clear why the dialog is not being dismissed when you call Get.back() inside the onTap function of your AlertDialogButton.

    One possible reason could be that the dialog is not being dismissed because it’s not associated with the current route managed by GetX. Here’s how you can ensure that the dialog is dismissed properly.

    Try this it works fine.

    PopScope(
      canPop: controller.selectedReasons.isEmpty,
      onPopInvoked: (didPop) async {
        if (didPop) {
          return;
        }
        await _superDialogController.show(
          title: 'Do you want to exit?',
          description: 'If you exit, the report will not be sent to us.',
          primaryOption: AlertDialogButton(
            text: 'Stay',
            onTap: () async {
              Get.back(); // Dismiss the dialog
            },
          ),
          secondaryOption: AlertDialogButton(
            text: 'Back',
            onTap: () async {
              controller.selectedReasons.clear();
              Get.back(); // Dismiss the dialog
            },
          ),
        );
      },
      child: Scaffold(), // Your scaffold content here
    );
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search