【Flutter】EdgeInsets｜上下左右の余白を調整

こんにちは、フラメルです。

今回はPaddingなど余白調整をする際に使用されるEdgeInsetsの使い方について紹介します。

EdgeInsets.all｜全サイドに同幅の余白を作る

EdgeInsets.all(30)

EdgeInsets.allでは上下左右の全サイドに同幅の余白を作れます。

上記コードでは上下左右に30ピクセルずつ余白ができます。

EdgeInsets.symmetric｜上下・左右別に余白を作る

EdgeInsets.symmetric(
  vertical: 20,
  horizontal: 40,
),

EdgeInsets.symmetricでは上下・左右別に余白を作れます。

上下の余白はvertical、左右の余白はhorizontalで指定できます。

EdgeInsets.only｜任意のサイドのみに余白を作る

EdgeInsets.only(
  left: 20,
  top: 40,
  right: 60,
  bottom: 80,
),

EdgeInsets.onlyでは任意のサイドのみに余白を作れます。

EdgeInsets.fromLTRB｜上下左右の余白を別々に調整

EdgeInsets.fromLTRB(20, 40, 60, 80),

EdgeInsets.fromLTRBでは上下左右の余白を別々に調整できます。

引数には左側・上側・右側・下側の順で余白を指定していきます。

以上です。