Change size of FloatingActionButton

Question

How do I change the size of a FloatingActionButton?

I've tried increasing the size of the icon, but it doesn't affect the surrounding circular shape. I've also tried wrapping the button in a PreferredSize widget, but this had no effect.

Answer 1

Wrap the FloatingActionButton in a Container, specifying the width and height.

You can override the size of the icon to make it look more natural:

Container(
  width: 80.0,
  height: 80.0,
  child: FloatingActionButton(
    onPressed: () {},
    child: Icon(
      Icons.add,
      size: 30.0,
    ),
  ),
);

I was pleased to discover the notch size is adjusted accordingly if you are embedding this button in a BottomAppBar.