How to link a drawer to tabBar in flutter

Question

I have this app that I'm creating in flutter but I didn't know how to add the button to open the side drawer in the appBar.it deosn't work unless I change the appBar: new TabBar to appBar: AppBar

import 'package:Schedule/UI/Home/homePage.dart';
import 'package:flutter/material.dart';
import 'models/global.dart';


void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
   
    return new MaterialApp
    (
      title: 'Schedule',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Schedule',)
    );
  }
}
class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: MaterialApp(
      color: Colors.yellow,
      home: DefaultTabController(
        length: 5,
        child: new Scaffold(
          body: Stack(
          children: <Widget>[
            TabBarView(
              children: [
                new Container(color: Colors.red,),
                new Container(color: Colors.blue,),
                HomePage(),  
                new Container(
                  color: Colors.white,
                ),
                new Container(
                  color: darkGreyColor,
                ),
              ],
            ),
            Container(
              height:150,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.only(
                  bottomLeft: Radius.circular(30),
                  bottomRight: Radius.circular(30),
                ),
                 color: Colors.white,
              )
              ),
               Container(
                 margin: EdgeInsets.only(top:130,left: MediaQuery.of(context).size.width*0.43),
                 child: FloatingActionButton(
                  child: Icon(Icons.add ),
                  backgroundColor: redColor,
                  onPressed: null,
                  ),
               ) 
          ],
          ),
          drawer: NavDrawer(),
          appBar: new TabBar(
            tabs: [
              Tab(
                icon: new Icon(Icons.menu),
              ),
              Tab(
                icon: new Icon(Icons.done),
              ),
              Tab(
                icon: new Icon(Icons.home),
              ),
              Tab(
                icon: new Icon(Icons.access_time),
              ),
              Tab(icon: new Icon(Icons.search),)
            ],
            labelColor: Colors.red[900],
            unselectedLabelColor: Colors.black,
            indicatorSize: TabBarIndicatorSize.label,
            indicatorPadding: EdgeInsets.all(5.0),
            indicatorColor: Colors.red[900],
          ),
          backgroundColor: Colors.white,
        ),
      ),
    ),
    );
  }
}
class NavDrawer extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          DrawerHeader(
            child: new UserAccountsDrawerHeader(
              accountName:null ,
              accountEmail: null,
              currentAccountPicture: null,
              )
          ),
          ListTile(
            leading: Icon(Icons.verified_user),
            title: Text('Profile'),
            onTap: () => {Navigator.of(context).pop()},
          ),
           ListTile(
            leading: Icon(Icons.notifications),
            title: Text('Notifications'),
            onTap: () => {},
          ),
          ListTile(
            leading: Icon(Icons.settings),
            title: Text('Settings'),
            onTap: () => {Navigator.of(context).pop()},
          ),
          ListTile(
            leading: Icon(Icons.border_color),
            title: Text('Feedback'),
            onTap: () => {Navigator.of(context).pop()},
          ),
          ListTile(
            leading: Icon(Icons.logout),
            title: Text('Logout'),
            onTap: () => {Navigator.of(context).pop()},
          ),
        ],
      ),
    );
  }
}

https://stackoverflow.com/questions/47435231/open-drawer-on-clicking-appbar i guess this is what u need — A. Tratseuski, Dec 28 '20 at 15:29

Jim · Accepted Answer · 2020-12-29T04:36:45.640

you can use TabController to open the drawer by using _scaffoldKey.currentState.openDrawer():

TabController _tabController;
final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: _categoryList.length, vsync: this);
  }
...

Scaffold(
      key: _scaffoldKey,
...

TabBar(
          controller: _tabController,
          onTap: (index){if(_tabController.index == 0) _scaffoldKey.currentState.openDrawer();}

How to link a drawer to tabBar in flutter

1 Answers1