CODEWITHSUNDEEP
androidflutterdartpopupflutter-showmodalbottomsheet
user17838882
user17838882

Reputation: 123

flutter showModalBottomSheet not pop when back button clicked

i want to pop showModalBottomSheet when i clicked the button of back in android mobile. this is my showModalBottomSheet example :

    showModalBottomSheet(
   context: contextt,
   useRootNavigator: true,
   isScrollControlled: true,
   isDismissible: true,
   enableDrag: true,
   shape: RoundedRectangleBorder(
   borderRadius: BorderRadius.vertical(top: Radius.circular(mySize.curve_large),
     ),),
   clipBehavior: Clip.antiAliasWithSaveLayer,
   builder: (contextt) {
      FocusScope.of(contextt).requestFocus(focusNode);
      return SizedBox(); });},

I use WillPopScope before my example widget "SizedBox", but its not work :

WillPopScope(
 onWillPop: () async {
 FocusScope.of(contextt).requestFocus(FocusNode());
 Navigator.of(contextt).pop();
 return false;
 },

can anyone help me how can I do that?

and by the way, when I clicked the back button twice in a row, showModalBottomSheet popped. I want to do that with one click!.

Upvotes: 0

Views: 7739

Answers (4)

intraector
intraector

Reputation: 1446

Using root navigator does the trick:

showModalBottomSheet<T>(
    context: context,
    useRootNavigator: true,
    builder: builder,
  );

Upvotes: 0

Shokie Varun
Shokie Varun

Reputation: 619

Not the exact solution Another workaround can be

  showModalBottomSheet().then((value)=>showModalBottomSheet());

The whole idea is calling again the bottom sheet when it is getting closed

OR For the exact solution try this

You can also use willpopscope to the builder/ bottomsheet which you are displaying

WillPopScope(
 onWillPop:() async{
   return false;
    },
    child:YourBottomSheet());

Upvotes: 2

Rushikesh Tokapure
Rushikesh Tokapure

Reputation: 139

try this

WillPopScope(
    onWillPop: () async {
        return (
            await showModalBottomSheet(
                //your code
            )
        )
    }
)

Upvotes: 1

Md. Kamrul Amin
Md. Kamrul Amin

Reputation: 2415

I have implemented the same modal as you, but when I click android system back button the modal is closing as it's supposed to. Check the following code for builder implementation:

import 'package:flutter/material.dart';
import 'package:sliding_up_panel/sliding_up_panel.dart';

void main() {
  runApp(
    MaterialApp(
      home: Scaffold(
        body: MyStatelessWidget()
      ),
    ),
  );
}

class MyStatelessWidget extends StatelessWidget {
  const MyStatelessWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        FocusScope.of(context).requestFocus(FocusNode());
        Navigator.of(context).pop();
        return false;
      },
      child: Center(
        child: ElevatedButton(
          child: const Text('showModalBottomSheet'),
          onPressed: () {
            showModalBottomSheet<void>(
              useRootNavigator: true,
              isScrollControlled: true,
              isDismissible: true,
              enableDrag: true,
              context: context,
              clipBehavior: Clip.antiAliasWithSaveLayer,
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.vertical(top: Radius.circular(80),
                ),),
              builder: (BuildContext context) {
                return Container(
                  height: 200,
                  color: Colors.amber,
                  child: Center(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      mainAxisSize: MainAxisSize.min,
                      children: <Widget>[
                        const Text('Modal BottomSheet'),
                        ElevatedButton(
                          child: const Text('Close BottomSheet'),
                          onPressed: () => Navigator.pop(context),
                        )
                      ],
                    ),
                  ),
                );
              },
            );
          },
        ),
      ),
    );
  }
}

Upvotes: 2

Related Questions