如何去除底部导航栏中Floating Action Button的白色背景

根据你的代码和截图，这个白色背景是AnimatedBottomNavigationBar中央缺口的默认颜色，结合调整FAB的阴影属性即可彻底解决：

步骤1：修改导航栏缺口颜色 #

在AnimatedBottomNavigationBar.builder中添加notchColor属性，将其设置为透明或与导航栏一致的主题色：

bottomNavigationBar: AnimatedBottomNavigationBar.builder(
  // 保留原有属性
  notchColor: Colors.transparent, // 也可设置为PayNestTheme.primaryColor
  // 保留原有属性
),

步骤2：去除FAB的阴影（可选） #

如果FAB自身的阴影看起来像白色边缘，给FloatingActionButton.extended添加阴影控制属性：

FloatingActionButton.extended(
  backgroundColor: PayNestTheme.primaryColor,
  elevation: 0, // 去掉默认阴影
  highlightElevation: 0, // 去掉点击状态的阴影
  // 保留原有属性
),

补充提示 #

你用Container包裹FAB的设置无需改动，若想更稳妥可给Container显式添加color: Colors.transparent（默认即为透明）。调整后FAB会与底部导航栏无缝衔接，不再出现白色背景。

内容的提问来源于stack exchange，提问作者Usama Bin Tahir