在 Flutter 底部导航栏中移除底部阴影效果

4

enter image description here

iPhone 11的底部导航栏有底部阴影,如上图所示,是否有方法可以去除阴影?
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    bottomNavigationBar: BottomAppBar(
      clipBehavior: Clip.antiAliasWithSaveLayer,
      shape: CircularNotchedRectangle(),
      child: Theme(
        data: Theme.of(buildContext)
            .copyWith(canvasColor: Colors.white, primaryColor: Colors.grey),
        child: BottomNavigationBar(
          onTap: (index){
            
          },
          type: BottomNavigationBarType.fixed,
          items: bottomNavigationBar.map((element) {
            return BottomNavigationBarItem(
                icon: Icon(element["icon"]), title: Text(element["title"]));
          }).toList(),
        ),
      ),
    ));

enter image description here

编辑:这是我在将高程设置为0后得到的结果。

enter image description here

编辑:在添加安全区底部应用栏阴影后,解决了问题,但是否可能保留我之前拥有的状态栏颜色(刘海区域)?

请尝试将 BottomAppBar 的高度设置为 0。 - Nilesh Senta
高度:0,移除底部导航栏顶部的阴影。但底部阴影仍然未变 :( - naveen
3
我已经看了上面的代码,elevation=0 的效果和你想要的一样完美。如果可能的话,你能分享一下添加 elevation=0 后得到的 bottomAppBar 图片吗? - Sanket Vekariya
我在设置底部应用栏的高度为0后,已将结果图像添加。 - naveen
2
如果你将整个 Scaffold 包装在 SafeArea 中会怎样?我猜问题出在屏幕的曲边缘上。 elevation 只适用于导航栏的顶部,而不是底部。 - Mobina
谢谢,安全区解决了底部应用栏的问题,但我之前设置的状态栏颜色(刘海区域)还能保留吗? - naveen
1个回答

7
在你的BottomNavigationBar中加入elevation: 0.0 例如:
child: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        backgroundColor: Theme.of(context).primaryColor,
        elevation: 0.0,

底部导航栏


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接