【Flutter】ウィジェットの間にスペースを作りたい時にSizedBoxではなくGapを使うと良い

2022/07/02に公開

はじめに

Flutterでウィジェット同士の間にのスペースを作りたい時に

Column(
  children: [
    WidgetA(),
    const SizedBox(height: 10),
    WidgetB(),
  ],
)

みたいに「いちいち const SizedBox(height: 10) とか書くのめんどくさいな〜、ホンマ」
って思う時ありますよね?

そんな時に使用するのが便利なgapです!
今回はこのgapパッケージについて紹介します!!!

Gapについて

https://pub.dev/packages/gap

GapはColumnRowの中で使用しますが、SizedBoxのように高さや幅を指定する必要がないのでより簡潔にスペースを表すことができます

使用例

Column(
  children: [
    WidgetA(),
    const Gap(10),
    WidgetB(),
  ],
)

めっちゃ簡単。幅や高さを指定せずに済むので簡潔に書くことができるねんな
よかったらみなさん使ってみてください!!

Flutter大学

Discussion