CODEWITHSUNDEEP
flutterflutter-layoutflutter-navigationflutter-drawer
Arijeet
Arijeet

Reputation: 1213

How to close the navigation drawer when returning back from a particular screen automatically in flutter?

I am working on a flutter project which has a navigation drawer with three routes. Whenever i go to a particular route and come back, the navigation drawer gets opened automatically. I want the navigation drawer to remain closed until and unless the user specifically clicks on it. Is there any way to achieve this?

Here's my code:

class NavList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          UserAccountsDrawerHeader(
            decoration: BoxDecoration(
                image: DecorationImage(
              image: AssetImage('images/orange.png'),
              fit: BoxFit.cover,
            )),
            arrowColor: Colors.deepOrangeAccent[700],
            accountName: Text(''),
            accountEmail: Text(
              '[email protected]',
              style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 20.0,
              ),
            ),
            currentAccountPicture: CircleAvatar(
              radius: 22.0,
              backgroundColor: Colors.deepOrangeAccent[700],
              backgroundImage: AssetImage('images/profile.png'),
            ),
          ),
          ListItems(
            listTitle: 'Shops',
            listIcon: Icon(Icons.shop),
            listFunction: () {
              Navigator.pushNamed(context, ShopScreen.id);
            },
          ),
          ListItems(
            listTitle: 'Orders',
            listIcon: Icon(Icons.monetization_on),
            listFunction: () {
              Navigator.pushNamed(context, OrderScreen.id);
            },
          ),
          ListItems(
            listTitle: 'Logout',
            listIcon: Icon(Icons.logout),
            listFunction: () {
              Navigator.pushNamed(context, LoginScreen.id);
            },
          ),
        ],
      ),
    );
  }
}

I have refactored ListItems.

class ListItems extends StatelessWidget {
  ListItems({this.listTitle, this.listIcon, this.listFunction});
  final String listTitle;
  final Icon listIcon;
  final Function listFunction;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(listTitle),
      leading: IconButton(
        icon: listIcon,
        onPressed: () {
          
        },
      ),
      onTap: listFunction,
    );
  }
}

Upvotes: 1

Views: 2979

Answers (3)

Ayyaz Shair
Ayyaz Shair

Reputation: 620

There are some ways to do that like:

onPressed:(){
   Navigator.pop(context);
   Navigator.pushNamed(context, ShopScreen.id);
 }

or use .then of the navigator:

onPressed:(){
   Navigator.pushNamed(context, ShopScreen.id).then((val){
   Navigator.pop(context);
  });
 }

additionally, you can check If the drawer currently open or not:

onPressed:(){
   Navigator.pushNamed(context, ShopScreen.id).then((val){
    if(Scaffold.of(context).isDrawerOpen){
     Navigator.pop(context);
     }
   });
  }

Upvotes: 3

Nabin Dhakal
Nabin Dhakal

Reputation: 2182

This may help you

onPressed: () {
                  Navigator.pop(context);
                 Navigator.of(context).pushNamed('/settings');
              }

Upvotes: 1

Raine Dale Holgado
Raine Dale Holgado

Reputation: 3440

I hadn't tested this out. Maybe this might work

onPressed: () async {
   await Navigator.pushNamed(
      context, "Screen").then((value) =>
       Scaffold.of(context).openEndDrawer());
   },

Upvotes: 1

Related Questions