Create Drawer With Title Header in Flutter

Create Scaffold

At home class, create a scaffold widget and inside that widget add drawer.

Scaffold(
    drawer: const CustomDrawer(),
    body: ....
)

Create CustomDrawer

...
Widget build(BuildContext context) {
    return Drawer(
        child: ListView(
            children: [
                SizedBox(height: 80, child: 
                    child: DrawerHeader(
                        child: Image.network("url", fit: BoxFit.contain),
                    ),
                ),
                ListTile(
                    onTap: () {}
                    horizontalTitleGap: 0.0,
                    leading: Icon(Icons.add, color: Colors.black, height: 16),
                    title: Text("Add New", style: TextStyle(color: Colors.black),),
                ),
                const Divider(
                    height: 1,
                    thickness: 1,
                ),
                 const Padding(
                     padding: EdgeInsets.all(16.0),                 
                     child: Text('Header'),
                 ),
                ListTile(
                    onTap: () {}
                    horizontalTitleGap: 0.0,
                    leading: Icon(Icons.add, color: Colors.black, height: 16),
                    title: Text("Add New", style: TextStyle(color: Colors.black),),
                ),
            ]
        ),
    );
}
...

Follow me @slimpotatoboy : Twitter, Instagram

Blog

Create Drawer With Title Header in Flutter

Dipen Maharjan

Create Scaffold

Create CustomDrawer

Join Our Newsletter. No Spam, Only the good stuff.

Related