在自定义浮动底部导航栏上居中 FAB

问题描述

我有一个容器，我将一个自定义剪刀与它相关联，它在它的中间做一个弧，我想将一个 FAB 放在那个弧上..我希望它在所有不同的屏幕尺寸上都有响应，这意味着FAB 的大小和圆弧的半径发生变化并使其居中。

PS：我用一个容器包裹了我的 FAB，所以我可以重新调整它的大小，但我无法弄清楚它的高度和宽度应该如何保持所有约束

我使用了一个主容器（红色），它有一个堆栈作为子项，然后在该堆栈上我确实放置了我的自定义容器（蓝色），然后是 FAB，如下所示：

return Container(
      color: Colors.red,padding: EdgeInsets.symmetric(horizontal: 28),child: Stack(
        children: [
          Positioned(
            top: 0,left: size.width / 2.66,child: Container(
              // can't figure out the appropriate height and width
              child: FloatingActionButton(
              mini: true,backgroundColor: Color(0xff8A1AE6),onpressed: () {},child: Icon(
                Icons.add,),elevation: 3,Padding(
            padding: EdgeInsets.only(top: 25),child: ClipPath(
              clipper: MyCustomClipper3(),child: Container(
                height: size.height * 0.075,width: double.infinity,margin: const EdgeInsets.symmetric(horizontal: 5,vertical: 5),decoration: Boxdecoration(
                  color: Colors.blue,borderRadius: BorderRadius.circular(20),child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,children: [
                    Icon(
                      Icons.home,color: Color(0xff8A1AE6),Icon(
                      Icons.settings_backup_restore,color: Colors.grey,Icon(
                      Icons.bar_chart,Icon(
                      Icons.supervised_user_circle,],);

第一屏结果：

不同屏幕上的结果：

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

dart flutter-layout mobile-application