[Flutter] ListViewに区切り線を付ける方法

Flutter

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

リストビューの要素ごとに区切り線を付ける方法を解説します。

スポンサーリンク

方法

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

ListViewで区切り線を付けるには、「Dividerウェジェット」を使います。

ListView(
              children: [
                ListTile(
                  title: Text("アイテム"),
                ),
                Divider(
                  height: 2,
                  thickness: 3,
                  color: Colors.black,
                ),
                ListTile(
                  title: Text("アイテム"),
                )
              ],
            )

Dividerウェジェットは、区切り線を表示するウェジェットです。

このウェジェットを、要素の間に配置することで、ListViewに区切り線を引くことが出来ます。

Dividerウェジェットは、引数なしでも使うことが出来ます。

引数を使うことで、高さ(height)、線の太さ(thickness)、色(color)の設定をすることが出来ます。

まとめ

ListViewに区切り線を付けるには、「Dividerウェジェット」を使います。

また、Dividerウェジェット以外にも、「ListView」の引数やメソッドを使って区切り線を付ける方法もあります。

コメント

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