Home > Software design >  Flutter Drawer gets closed automatically outside of it's click
Flutter Drawer gets closed automatically outside of it's click

Time:03-08

I want to prevent my end drawer to be closed after clicking outside of it, I open my endDrawer with this line scaffoldKey.currentState.openEndDrawer so when I accidentally click outside of this drawer where you see gray drawerScrimColor it gets closed automatically as per its natural behavior, I do not want to do that what I see is only endDrawerEnableOpenDragGesture: false but this prevents my drawer not to be opened with DragGesture but my problem is different I do not want my drawer be closed automatically upon clicking outside of it please help me out your help will be appreciated thanks a lot in advance

CodePudding user response:

I faced the exact same scenario in my app in which I wanted to disable the drawer closing when the outer translucent scrim is clicked.

This is the solution I used (still use):

return Scaffold(
  ...,
  drawer: Container(
          color: Colors.transparent,
          child:
              Row(children: const [SizedBox(width: 304, child: DrawerMenu())])),
  ...
);

The color of the Container has to be set to something else it won't work. It is set to transparent as Scaffold's default translucent scrimColor is enough.

The width is set to 304 as this is default width of the Drawer as mentioned here.

The Row used here, is not over-engineering, it is used to prevent the child widget expanded to the screen width which is the default behavior of Scaffold's Drawer.

I use this instead of other solutions based on overriding the Gestures as it's simple and it doesn't affect Scrolling in/Dragging the Drawer.

  • Related