endDrawer property

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 either ScaffoldState.closeEndDrawer, Navigator.pop or press the escape key on the keyboard.

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.

To see it in action, copy and run this code snippet on DartPad.

import 'package:material_ui/material_ui.dart';

/// Flutter code sample for [Scaffold.endDrawer].

void main() => runApp(const EndDrawerExampleApp());

class EndDrawerExampleApp extends StatelessWidget {
  const EndDrawerExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(home: EndDrawerExample());
  }
}

class EndDrawerExample extends StatefulWidget {
  const EndDrawerExample({super.key});

  @override
  State<EndDrawerExample> createState() => _EndDrawerExampleState();
}

class _EndDrawerExampleState extends State<EndDrawerExample> {
  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: .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,
    );
  }
}

Implementation

Scaffold class