skip to Main Content

I want achieve this drawer header
enter image description here

But mine have lot of space.How to remove the extra space in drawer header?

enter image description here

Code

class AppDrawer extends HookWidget {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          _createHeader(),
          _createDrawerItem(
            icon: Icons.contacts,
            text: 'Contacts',
            onTap: () {},
          ),
          _createDrawerItem(
            icon: Icons.event,
            text: 'Events',
            onTap: () {},
          ),
        ],
      ),
    );
  }

  Widget _createDrawerItem(
      {required IconData icon,
      required String text,
      required GestureTapCallback onTap}) {
    return ListTile(
      title: Row(
        children: <Widget>[
          Icon(icon),
          Padding(
            padding: const EdgeInsets.only(left: 8.0),
            child: Text(text),
          )
        ],
      ),
      onTap: onTap,
    );
  }

  Widget _createHeader() {
    return const DrawerHeader(
        decoration: BoxDecoration(color: Colors.green),
        child: ListTile(
          title: Text("Name"),
          subtitle: Text("Email"),
          dense: true,
          leading: CircleAvatar(child: Icon(Icons.people)),
        ));
  }
}

Ignore this line epfokeofkpekf efewfefeefefefefefefewf fewfef fefef
fefjoej jifjeojfo oijoewfjoej oijfoijfoiejf rvw

2

Answers


  1. Instead of DrawerHeader you can use Container or SizedBox to change its height according to the requirement.

    Login or Signup to reply.
  2. Instead of using DrawerHeader() you can use Container().

    Example:

    class AppDrawer extends HookWidget {
      @override
      Widget build(BuildContext context) {
        return Drawer(
          child: ListView(
            padding: EdgeInsets.zero,
            children: <Widget>[
              _createHeader(),
              _createDrawerItem(
                icon: Icons.contacts,
                text: 'Contacts',
                onTap: () {},
              ),
              _createDrawerItem(
                icon: Icons.event,
                text: 'Events',
                onTap: () {},
              ),
            ],
          ),
        );
      }
    
      Widget _createDrawerItem(
          {required IconData icon,
          required String text,
          required GestureTapCallback onTap}) {
        return ListTile(
          title: Row(
            children: <Widget>[
              Icon(icon),
              Padding(
                padding: const EdgeInsets.only(left: 8.0),
                child: Text(text),
              )
            ],
          ),
          onTap: onTap,
        );
      }
    
      Widget _createHeader() {
        return Container(
            height: 100,
            decoration: BoxDecoration(color: Colors.green),
            child: ListTile(
              title: Text("Name"),
              subtitle: Text("Email"),
              dense: true,
              leading: CircleAvatar(child: Icon(Icons.people)),
            ));
      }
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search