如何移除Flutter中Drawer与列表之间的分隔线？

这条分隔线是ListView默认生成的——当你把DrawerHeader和ListTile作为ListView的子项时，ListView会自动在子项之间添加分割线（受主题或默认构造逻辑影响）。以下是几种移除它的实用方法：

方法一：设置ListView的dividerColor为透明（推荐） #

直接给ListView添加dividerColor: Colors.transparent，让分割线完全不可见，不需要调整布局结构：

@override
Widget build(BuildContext context) {
  return Drawer(
    child: ListView(
      dividerColor: Colors.transparent, // 关键代码：将分割线设为透明
      children: [
        const DrawerHeader(
          decoration: BoxDecoration(
            color: Colors.blueGrey,
            borderRadius: BorderRadius.only(
              bottomLeft: Radius.circular(40),
              bottomRight: Radius.circular(40),
            ),
          ),
          child: Text('Settings'),
        ),
        ListTile(
          leading: const Icon(Icons.settings),
          title: const Text("Blue Print"),
        ),
      ],
    ),
  );
}

方法二：用Column替代ListView #

如果不需要ListView的自动分割线特性，可以用Column包裹子项，再套上SingleChildScrollView处理滚动（避免内容超出屏幕时无法滑动）：

@override
Widget build(BuildContext context) {
  return Drawer(
    child: SingleChildScrollView(
      child: Column(
        children: [
          const DrawerHeader(
            decoration: BoxDecoration(
              color: Colors.blueGrey,
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(40),
                bottomRight: Radius.circular(40),
              ),
            ),
            child: Text('Settings'),
          ),
          ListTile(
            leading: const Icon(Icons.settings),
            title: const Text("Blue Print"),
          ),
        ],
      ),
    ),
  );
}

方法三：使用ListView.separated自定义分割线 #

通过ListView.separated手动将分割线替换为空白组件，完全控制子项间的间隔：

@override
Widget build(BuildContext context) {
  return Drawer(
    child: ListView.separated(
      itemCount: 2, // 子项总数
      separatorBuilder: (context, index) => SizedBox.shrink(), // 移除分割线
      itemBuilder: (context, index) {
        if (index == 0) {
          return const DrawerHeader(
            decoration: BoxDecoration(
              color: Colors.blueGrey,
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(40),
                bottomRight: Radius.circular(40),
              ),
            ),
            child: Text('Settings'),
          );
        } else {
          return ListTile(
            leading: const Icon(Icons.settings),
            title: const Text("Blue Print"),
          );
        }
      },
    ),
  );
}

内容的提问来源于stack exchange，提问作者FelX3