[Flutter]FloatingActionButtonの下部分にマージンを設定する方法

どうも、ちょげ(@chogetarou)です。

FloatingActionButtonの下部分にマージンを設定する方法を紹介します。

方法

FloatingActionButtonの下部分にマージンを設定するには、「Padding」ウェジェットを使います。

まず、Paddingウェジェットの「child」に、「FloatingActionButton」を指定します。

次に、引数「padding」に「EdgeInsets.only」を指定します。

最後に、「EgedInsets.only」の引数「bottom」で、下部のマージンを設定します。

Scaffold(
  body: Test(),
  floatingActionButton: Padding(
    padding: const EdgeInsets.only(bottom: 100), //下部のマージンを設定
    child: FloatingActionButton(onPressed: () {}),
  ),
)

まとめ

FloatingActionButton下部のマージンを設定するには、「Padding」ウェジェットを使います。

Paddingウェジェットの引数「padding」に、EdgeInsets.only()を指定し、引数「bottom」で下部のマージンの値を設定します。

また、FloatingActionButtonは、Paddingの子ウェジェットにします。