Flutter Drawer Logo下方白色分割线移除问题及代码解决方案需求

你遇到的白色分割线是DrawerHeader自带的默认底部边框，和你手动添加的Divider无关——即使设置了color: Colors.transparent，这个默认边框依然会显示。下面给两种直接解决的代码方案：

方案1：移除DrawerHeader的默认边框和顶部内边距 #

通过给DrawerHeader的decoration设置空边框，再用MediaQuery.removePadding去掉默认的顶部内边距（可选，如果你不需要顶部留白）：

drawer: Drawer(
  backgroundColor: Colors.grey[900],
  child: Column(
    children: [
      MediaQuery.removePadding(
        context: context,
        removeTop: true,
        child: DrawerHeader(
          decoration: const BoxDecoration(
            color: Colors.transparent,
            border: Border(), // 清除默认底部边框
          ),
          child: Image.asset(
            'lib/images/puma.png',
            color: Colors.white38,
            fit: BoxFit.contain,
          ),
        ),
      ),
      Padding(
        padding: const EdgeInsets.symmetric(horizontal: 50.0),
        child: Divider(
          color: Colors.grey[800],
          thickness: 2,
        ),
      ),
      // 其他抽屉项
    ],
  ),
),

方案2：用Container替代DrawerHeader #

如果不需要DrawerHeader的默认行为，直接用Container自定义头部，彻底摆脱默认样式限制：

drawer: Drawer(
  backgroundColor: Colors.grey[900],
  child: Column(
    children: [
      // 自定义头部，高度和DrawerHeader默认一致（160px）
      Container(
        height: 160,
        padding: const EdgeInsets.all(16),
        child: Image.asset(
          'lib/images/puma.png',
          color: Colors.white38,
          fit: BoxFit.contain,
        ),
      ),
      Padding(
        padding: const EdgeInsets.symmetric(horizontal: 50.0),
        child: Divider(
          color: Colors.grey[800],
          thickness: 2,
        ),
      ),
      // 其他抽屉项
    ],
  ),
),

两种方案都能完全移除那条白色分割线，选哪个看你是否需要保留DrawerHeader的组件特性。

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