Home > OS >  Move floatingactionbutton Flutter
Move floatingactionbutton Flutter

Time:03-07

How to move floatingactionbutton like in the picture?

enter image description here

CodePudding user response:

You need to use floatingActionButtonLocation on Scaffold. While I can't find partial positioning method, you can create a custom class by extending FloatingActionButtonLocation

class CustomFabLoc extends FloatingActionButtonLocation {
  @override
  Offset getOffset(ScaffoldPrelayoutGeometry scaffoldGeometry) {
    return Offset(
      scaffoldGeometry.scaffoldSize.width * .25, ///customize here
      scaffoldGeometry.scaffoldSize.height - kToolbarHeight,
    );
  }
}

And use

return Scaffold(
  floatingActionButtonLocation: CustomFabLoc(),
  floatingActionButton: FloatingActionButton(
    onPressed: () {},
  ),
);

CodePudding user response:

Try this:

floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked, //specify the location of the FAB
  floatingActionButton: FloatingActionButton(
    onPressed: () {},
    tooltip: "Centre FAB",
    child: Container(
      margin: EdgeInsets.all(15.0),
      child: Icon(Icons.add),
    ),
    elevation: 4.0,
  ),

Then you can add your bottom bar

  • Related