Padding class

1591 ワード

指定したpaddingに従ってchildの部品を追加します.

上の写真は少しも空間がありませんが、退屈に見えますか?
四角い間に少しスペースを残してはどうですか?
このように空間すなわちエッジが必要な場合,padding部品を用いて解決することができる.
Paddingコンポーネントを使用すると、スペースを作成して配置できます.
次はpaddingコンポーネントを使用してスペースを作成した結果です.

ではpaddingはどのように使いますか?

このように、どの部分にどれだけのスペースを残すかを決め、paddingを適用するchildを入れればよい.
パッドの方法は多種多様である.
これはEdgeInsetsのタイプによって異なります.

1. EdgeInsets.fromLTRB()


LTRBは、Left、Top、Right、Bottomから順番に取った最初の文字です.
EdgeInsets.fromLTRBを使用して、必要なchildの左、上、右、下の余白の大きさを決定します.
例)

2. EdgeInsets.all()


すべての部分(左、右、上、下)に同じサイズのマージンを与えます.

3. EdgeInsets.only()


特定の部分に指定した値のサイズを残します.
例)
EdgeInsets.only(top: 30, bottom: 20)

これにより、左、上、下、右のうちの特定の部分にそれぞれ異なる値を余白として残すことができる.

4. EdgeInsets.symmetric()


縦と横を基準に空白の値を指定します.

水平=水平
垂直=垂直
水平方向に値を指定すると、左右の余白が決まります.
垂直に値を指定すると、上下の余白を決定できます.

5. EdgeInsets.fromSTEB


STEBは、Start、Top、End、Bottomから順番に取った最初の文字です.
それを使って、左がstart、右がendです.