是否可以为停靠的浮动操作按钮添加填充或边距？

Question

如下图所示，我的按钮靠近屏幕边缘感觉不舒服。有没有办法将按钮移动到远离屏幕边缘的位置，同时保持凹口外观？如果我向按钮添加填充，它会正确移动按钮，但凹口会变得混乱..

参考代码：

      bottomNavigationBar: BottomAppBar(
        shape: const CircularNotchedRectangle(),
        child: Container(
          height: 70.0,
        ),
      ),

      floatingActionButton: Container(
        child: FloatingActionButton(
          onPressed: null,
          child: Icon(Icons.menu),
        ),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.endDocked,

如果我在按钮上使用边距或填充，它会是什么样子：

Answer 1

我硬编码了x范围100，你可以根据你的要求修改

第1步：

static const double fabIconHeight= 50.0;

@override
Widget build(BuildContext context) {
  return SafeArea(
    child: LayoutBuilder(
      builder: (context, constraint) {
        return Scaffold(
          bottomNavigationBar: BottomAppBar(
            shape: const CircularNotchedRectangle(),
            child:  Container(
            height: 70.0,
            )
          ),
          floatingActionButton: new FloatingActionButton(
            child: Icon(Icons.dehaze),
            onPressed: () {},
          ),
          floatingActionButtonLocation: CustomFloatingActionButtonLocation(
              constraint.maxWidth - 100,
              constraint.maxHeight - fabIconHeight - (fabIconHeight / 2)),
        );
      },
    ),
  );
}

第2步：

class CustomFloatingActionButtonLocation implements FloatingActionButtonLocation {
  final double x;
  final double y;
  const CustomFloatingActionButtonLocation(this.x, this.y);

  @override
  Offset getOffset(ScaffoldPrelayoutGeometry scaffoldGeometry) {
    return Offset(x, y);
  }
}

或

class CustomFloatingActionButtonLocation
    implements FloatingActionButtonLocation {
  static const double fabIconHeight = 50.0;

  const CustomFloatingActionButtonLocation();

  @override
  Offset getOffset(ScaffoldPrelayoutGeometry scaffoldGeometry) {
    return Offset(
        scaffoldGeometry.scaffoldSize.width - 100,
        scaffoldGeometry.scaffoldSize.height - (70.0 / 2) -
            fabIconHeight -
            (fabIconHeight / 2));
  }
}