如何摆脱自定义底部导航栏周围的白色 space 抖动？

Question

我创建了一个自定义底部中殿栏，但它周围仍然有一个白色 space。如何摆脱它？另外，如果我将按钮放入容器中以为其指定高度或宽度，也会发现同样的问题。

图像是：

代码是：

bottomNavigationBar: ClipRRect(
        borderRadius: const BorderRadius.all(Radius.circular(40)),
        // clipper: ,
        child: Container(
          clipBehavior: Clip.hardEdge,
          margin: EdgeInsets.all(5.w),
          decoration: BoxDecoration(
            color: whiteColor,
            borderRadius: const BorderRadius.all(Radius.circular(10)),
            boxShadow: [
              BoxShadow(
                color: shadowColor.withOpacity(0.5),
                spreadRadius: 5,
                blurRadius: 7,
                offset: const Offset(0, 3), // changes position of shadow
              ),
            ],
          ),
          child: BottomNavigationBar(
            currentIndex: pageIndex,
            onTap: (int value) {
              pageIndex = value;
              setState(() {});
            },
            type: BottomNavigationBarType.fixed,
            items: [
              BottomNavigationBarItem(
                icon: Icon(Icons.home),
                label: 'home'.tr,
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.flag_sharp),
                label: "add_opportunity".tr,
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.person),
                label: 'profile'.tr,
              ),
            ],
          ),
        ),
      ),

Answer 1

尝试扩展主体：

return Scaffold(
  extendBody: true,
  bottomNavigationBar: ClipRRect(
    borderRadius: const BorderRadius.all(Radius.circular(40)),

如何摆脱自定义底部导航栏周围的白色 space 抖动？

how to get rid of white space around the custom bottom navBar flutter?

flutter

user-interface

flutter-bottomnavigation