Remove Padding or Margin from Drawer Header in Flutter App

Question

How do I remove the padding or margin from my Drawer Header in this example below.

I've set margin and padding to EdgeInsets.zero for both but this is not doing the job.

Menu Screen Example Image

Here is the code that produced this menu. Everything works. I simply can't remove the padding from the header specifically. The blue field should reach all the way to the edges on the top and sides.

import "package:flutter/material.dart";
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My Menu App',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: AppDrawer(mainMenu),
      appBar: AppBar(
        title: Text("My Menu App"),
      ),
    );
  }
}

class AppDrawer extends StatelessWidget {
  List menuChoices;

  AppDrawer(this.menuChoices);

  @override
  Widget build(BuildContext context) {

    return Drawer(
      child: ListView.builder(
        padding: EdgeInsets.zero,
        itemCount: menuChoices.length,
        itemBuilder: (BuildContext cntxt, int index) {
          return _constructItem(menuChoices[index]);
        },
      ),
    );
  }

  Widget _constructHeader(Choices choice) {
    return DrawerHeader(
      margin: EdgeInsets.zero,
      padding: EdgeInsets.zero,
      child: Container(
        child: Stack(
          children: <Widget>[
            Positioned(
              bottom: 12.0,
              left: 16.0,
              child: Text(
                choice.title,
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 20.0,
                    fontWeight: FontWeight.w500),
              ),
            ),
          ],
        ),
      ),
      decoration: BoxDecoration(
        color: Colors.blue,
      ),
    );
  }

  Widget _constructItem(Choices choice) {
    switch (choice.itemType) {
      case "Header":
        return DrawerHeader(child: _constructHeader(choice));
        break;

      case "Item":
        return ListTile(
            leading: Icon(choice.icon),
            title: Opacity(
              opacity: choice.enabled ? 1 : 0.5,
              child: Text(choice.title),
            ),
            onTap: choice.action,
            enabled: choice.enabled);
        break;

      case "Divider":
        return Divider(
          thickness: 2.0,
        );
        break;
    }
  }
}

class Choices {
  const Choices(
      {@required this.title,
      @required this.itemType,
      this.icon,
      this.enabled = true,
      this.action});

  final String itemType;
  final String title;
  final IconData icon;
  final bool enabled;
  final Function action;
}

// These are the menu choices
const List<Choices> mainMenu = const <Choices>[
  const Choices(
    itemType: "Header",
    title: "My Header Text",
    icon: Icons.face,
  ),
  const Choices(
    itemType: "Item",
    title: 'My Profile',
    icon: Icons.person,
    enabled: true,
    action: null,
  ),
  const Choices(
    itemType: "Divider",
  ),
  const Choices(
    itemType: "Item",
    title: 'About',
    icon: Icons.info,
    enabled: true,
    action: null,
  ),
  const Choices(
    itemType: "Divider",
  ),
  const Choices(
    itemType: "Item",
    title: 'Help',
    icon: Icons.help_outline,
    enabled: true,
    action: null,
  ),
];

Answer 1

DrawerHeader has been called both in the switch statement and in the _constructHeaderMethod. Simply calling the _constructHeaderMethod is all that is needed. Essentially I had a DrawerHeader as a child of a DrawerHeader which was unnecessary.

Changing the _constructItem method as below solves the problem.

Widget _constructItem(Choices choice) {
    switch (choice.itemType) {
      case "Header":
        return _constructHeader(choice);
        break;

      case "Item":
        return ListTile(
            leading: Icon(choice.icon),
            title: Opacity(
              opacity: choice.enabled ? 1 : 0.5,
              child: Text(choice.title),
            ),
            onTap: choice.action,
            enabled: choice.enabled);
        break;

      case "Divider":
        return Divider(
          thickness: 2.0,
        );
        break;
    }
  }
}

Answer 2

Widget _constructItem(Choices choice) {
switch (choice.itemType) {
  case "Header":
    return DrawerHeader(padding: EdgeInsets.zero ,child: _constructHeader(choice));
    break;

  case "Item":
    return ListTile(
        leading: Icon(choice.icon),
        title: Opacity(
          opacity: choice.enabled ? 1 : 0.5,
          child: Text(choice.title),
        ),
        onTap: choice.action,
        enabled: choice.enabled);
    break;

  case "Divider":
    return Divider(
      thickness: 2.0,
    );
    break;
}
}