How to open the drawer by use of left swipe like Gmail in flutter?

Question

I want to open my left navigation pane only by swiping left to right from any point on the screen and not just from the extreme left.

@override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Best Shape of My Life.',
      theme: ThemeData(primaryColor: Colors.green, fontFamily: 'Product-Sans'),
      home: Scaffold(
          appBar: AppBar(
            title: const Text('Best Shape of My Life.'),
            centerTitle: true,
            backgroundColor: Colors.black,
          ),
          body: const Center(
            child: Text('Woww World'),
          ),
          backgroundColor: Colors.black,
          drawer: Drawer(
              child: ListView(
            padding: EdgeInsets.zero,
          ))),
    );
  }
}

This is opening the navigation bar but only when swiped from the extreme left which causes issue since I use swipe navigation.

Answer 1

Have you tried looking into gesture detectors? You might be able to wrap your drawer class into a gesture detector and trigger the drawer to open. This might also mean a custom widget.

https://api.flutter.dev/flutter/widgets/GestureDetector-class.html

Answer 2

Try this

@override
Widget build(BuildContext context) {
  return MaterialApp(
    title: 'Best Shape of My Life.',
    theme: ThemeData(primaryColor: Colors.green, fontFamily: 'Product-Sans'),
    home: Scaffold(
        appBar: AppBar(
          title: const Text('Best Shape of My Life.'),
          centerTitle: true,
          backgroundColor: Colors.black,
        ),
        body: const Center(
          child: Text('Woww World'),
        ),
        backgroundColor: Colors.black,
        drawer: Drawer(
            child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            DrawerHeader(
              child: Text('Drawer Header'),
              decoration: BoxDecoration(
                color: Colors.blue,
              ),
            ),
            ListTile(
              title: Text('Item 1'),
              onTap: () {
                // Update the state of the app
                // ...
                // Then close the drawer
                Navigator.pop(context);
              },
            ),
            ListTile(
              title: Text('Item 2'),
              onTap: () {
                // Update the state of the app
                // ...
                // Then close the drawer
                Navigator.pop(context);
              },
            ),
          ],
        ))),
  );
}