如何从顶部Flutter底部导航栏制作弧形

Question

我想在 Flutter 中制作这个弯曲的底部导航栏

但我得到的是这个

我正在使用 ClipRRect 来做到这一点，但这不是我需要的，这是我的代码

      bottomNavigationBar: Container(
        decoration: const BoxDecoration(
          borderRadius: BorderRadius.only(topRight: Radius.circular(500),topLeft: Radius.circular(500),),
          color: Color(0xfff2f2f2),
          boxShadow: [
            BoxShadow(
              color: Colors.grey,
              offset: Offset(5.0, 10.0), //(x,y)
              blurRadius: 20.0,
            ),
          ],
        ),
        child: ClipRRect(
          borderRadius: const BorderRadius.only(topRight: Radius.circular(500),topLeft: Radius.circular(500),),
          child: BottomNavigationBar(
            items: [
              BottomNavigationBarItem(icon: Image.asset(logo,height: HDW().fullHeight(context: context,height: 0.1),color: darkGreen,),label: ''),
              BottomNavigationBarItem(icon: Image.asset(logo,height: HDW().fullHeight(context: context,height: 0.1),color: darkGreen,),label: ''),
            ],
          ),
        ),
      ),

Answer 1

您可以使用 custon Paint 小部件，用它您可以在 Flutter 中构建任何您想要的形状

此视频可以帮助您设计和实现底部导航栏的自定义形状==> Flutter - 自定义形状的底部导航栏