英文:
Remove extra space in drawer header
问题
我想要实现这个抽屉标题
但是我的抽屉有很多空白。如何去除抽屉标题中的额外空间？
代码
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)),
));
}
}
英文:
I want achieve this drawer header
But mine have lot of space.How to remove the extra space in drawer header?
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
答案1
得分: 2
你可以使用 Container 或 SizedBox 代替 DrawerHeader，以根据需求更改其高度。
英文:
Instead of DrawerHeader you can use Container or SizedBox to change its height according to the requirement.
答案2
得分: 2
不使用 DrawerHeader()，可以使用 Container()。
示例：
class AppDrawer extends HookWidget {
@override
Widget build(BuildContext context) {
return Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: <Widget>[
_createHeader(),
_createDrawerItem(
icon: Icons.contacts,
text: '联系人',
onTap: () {},
),
_createDrawerItem(
icon: Icons.event,
text: '事件',
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("姓名"),
subtitle: Text("邮箱"),
dense: true,
leading: CircleAvatar(child: Icon(Icons.people)),
));
}
}
英文:
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)),
));
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论