Reputation: 848
Currently the drawer header occupies a fixed height. How can I reduce the height of the drawer header to fit the content of its children?
child: ListView(
padding: EdgeInsets.zero,
children: [
DrawerHeader(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.account_box),
Text(
'Name Here',
style: Theme.of(context).textTheme.headline5,
),
Text('Email Here'),
]),
decoration: BoxDecoration(
color: Theme.of(context).accentColor,
),
),
Upvotes: 0
Views: 1016
Reputation: 21691
You wrap this with a Container widget
Container( height: 140.0,
child: DrawerHeader(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.account_box),
Text(
'Name Here',
style: Theme.of(context).textTheme.headline5,
),
Text('Email Here'),
]),
decoration: BoxDecoration(
color: Colors.blue[300],
),
)),
Upvotes: 0
Reputation: 2327
You can wrap DrawerHeader
this with a Container
widget.
Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: <Widget>[
Container(
height: 120,
child: DrawerHeader(
child: Column(
children: [
Icon(Icons.account_box),
Text(
'Name Here',
style: Theme.of(context).textTheme.headline5,
),
Text('Email Here'),
],
),
decoration: BoxDecoration(
color: Colors.blue,
),
),
),
],
),
),
Upvotes: 1
Reputation: 196
You can wrap the header inside SizedBox or Container. One suggestion: Wrap the header inside column, not in the list view because header should not be scrollable. Make listview the second child of column.
Upvotes: 0