#はじめに
Flutterでアイテムを縦に並べるときに使用する
ソーシャルメディアのタイムラインのイメージ
#方法
タイトルにある通り、ListView Widgetを利用
このウィジェットの中のbuilderメソッドを使うことで動的にリストを生成することが可能
#builderの使い方
builder内の書き方を解説
##引数
itemBuilder
itemCount
###itemBuilder
リストを作ってくれる
BuildContext contextとint indexを引数にした、無名関数を書く
contextは、画面表示内容を生成するために必要なもの(詳しいことわかりません。ごめんなさい。)
indexは、1行目、2行目、3行目、、、と増加していくインクリメンタ。下のitemCountを設定していないと、無限に増加しようとする
###itemCount
リストにするアイテムの数を指定
指定しないと無限にリストを生成する、または、配列内のアイテムの個数を超過するとエラーが発生
よって、配列の長さを渡しておくのがよい
#コードと画面イメージ
##コード
※runAppなどは含めていない
static const _userNames = <String>[
'Alex',
'Bob',
'Cathy',
'David',
'Edward',
'Frank',
'George',
'Henry',
];
@override
Widget build(BuildContext context) {
return Container(
child: ListView.builder(
itemBuilder: (BuildContext context, int index){
String rtnStr = _userNames[index];
return Container(
padding: EdgeInsets.all(8.0),
child: Text('$rtnStr'),);
},
itemCount: _userNames.length,
),
);
}
##画面イメージ
以下の通り、上から配列(_userNames)の内容が表示される
※ヘッター、フッターは上記のコードでは生成されない
#参考にした記事
ListView, Flutter Doc Jp