[Flutter]ボタンにマージンを設定する方法

Flutter

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

ボタンにマージンを設定する方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

ボタンにマージンを設定するには、Paddingウェジェットを使います。

Paddingウェジェットの「padding」にマージンに設定した値を設定します。

そして、引数「child」にボタンを指定します。

            Padding(
              padding: const EdgeInsets.all(8.0), //マージン
              child: TextButton(
                onPressed: () {},
                child: Text('Button'),
              ),
            )

EdgeInsets.all()で指定した値がマージンになります。

「Paddingで設定するのは、マージンじゃなくてパディングでしょ?」
と思う人もいるかもしれません。

確かにそうなのですが、Paddingが設定するのは、「child」と外の枠の余白です。

なので、実際には、ボタンの外側の余白が設定され、マージンと同じ意味になるのです。

まとめ

ボタンのマージンを設定するには、Paddingウェジェットを使います。

Paddingの引数「padding」に設定したものがマージンになります。

コメント

タイトルとURLをコピーしました