endDrawer property

Widget? endDrawer

A panel displayed to the side of the body, often hidden on mobile devices. Swipes in from right-to-left (TextDirection.ltr) or left-to-right (TextDirection.rtl)

Typically a Drawer.

To open the drawer, use the ScaffoldState.openEndDrawer function.

To close the drawer, use Navigator.pop.

{@tool dartpad --template=stateful_widget_material} To disable the drawer edge swipe, set the Scaffold.endDrawerEnableOpenDragGesture to false. Then, use ScaffoldState.openEndDrawer to open the drawer and Navigator.pop to close it.

final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

void _openEndDrawer() {
  _scaffoldKey.currentState!.openEndDrawer();
}

void _closeEndDrawer() {
  Navigator.of(context).pop();
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    key: _scaffoldKey,
    appBar: AppBar(title: const Text('Drawer Demo')),
    body: Center(
      child: ElevatedButton(
        onPressed: _openEndDrawer,
        child: const Text('Open End Drawer'),
      ),
    ),
    endDrawer: Drawer(
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text('This is the Drawer'),
            ElevatedButton(
              onPressed: _closeEndDrawer,
              child: const Text('Close Drawer'),
            ),
          ],
        ),
      ),
    ),
    // Disable opening the end drawer with a swipe gesture.
    endDrawerEnableOpenDragGesture: false,
  );
}

{@end-tool}

Implementation

final Widget? endDrawer;