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

Flutter Web – How to close dialog opened when the user clicks back button in web browser?

I use Getx for my application navigation. I navitage from ‘/home_screen’ to ‘/user_screen’, then I open dialog in ‘/user_screen’. When I press back button in web browser, I want to close dialog and navigate back from ‘/user_screen’ to ‘/home’ screen, but it does’nt.
This is my Code show dialog.

Container(
      margin: const EdgeInsets.only(left: 10, right: 10),
      child: ElevatedButton(
          style: ElevatedButton.styleFrom(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(4),
            ),
            backgroundColor: Get.theme.colorScheme.primary,
          ),
          onPressed: () {
            //show Dialog
            Get.dialog(_createFormDialog(context));
          },
          child: Text(
            "Create Form",
            style: AppStyle.bodyMedium.copyWith(color: Get.theme.colorScheme.onPrimary),
          )),
    ),

This is my Dialog

Widget _createFormDialog(BuildContext context) {
controller.descriptionEditorController.clear();
return AlertDialog(
  title: Text(
    "lbl_create_form".tr,
    style: AppStyle.headingMedium.copyWith(color: context.theme.listTileTheme.selectedTileColor),
  ),
  content: AnimatedContainer(
    duration: const Duration(milliseconds: 300),
    width: Get.width * 0.7,
    height: Get.height * 0.8,
    child: SingleChildScrollView(
      
    ),
  ),
  actions: [
    Row(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
      ],
    )
  ],
);

}

And navigation code:

Get.rootDelegate.toNamed(Routes.home);

Help me, please!

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I listen press back button in web browser event using:

    import 'dart:html' as html;

    And then:

    html.window.onPopState.listen((_) {
      final navigator = Navigator.of(context, rootNavigator: true);
      if (navigator.canPop()) {
        navigator.pop();
      }
    });

  2. 0 
    showDialog(
  context: context,
  builder: (context) => AlertDialog(
    title: Text('Result'),
    content: Text('Result is $_result'),
    actions: [
      ElevatedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go Back'))
    ],
  ),
);

    now using using this context you can close the dialogue anywhere

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search