どうも、ちょげ(@chogetarou)です。
リストビューで最後の要素を表示する方法を紹介します。
方法
リストビューで最後の要素を表示するには、ScrollControllerと「jumpToメソッド」を使います。
まず、ScrolCotrollerを用意します。
var _controller = ScrollController();次に、ListViewもしくはListView.builderの引数「controller」に用意したScrolControllerを指定します。
ListView(
controller: _controller,
children: [],
)そして、ボタンなどに最後の要素を表示する処理を追加します。
_controller.jumpTo(_controller.position.maxScrollExtent);jumpToメソッドによって特定の位置に移動することが出来ます。
最後の要素の場合は、「_controller.position.maxScrollExtent」を引数に指定します。
これでリストビューで最後の要素を表示することが出来ます。
以下は、使用例です。
var _controller = ScrollController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
controller: _controller,
children: [
for (var i = 0; i < 50; i++)
Card(
color: Colors.green,
child: ListTile(
title: Text('$i'),
),
),
Card(
color: Colors.pink,
child: ListTile(
title: Text('50'),
),
)
],
),
floatingActionButton: FloatingActionButton(
onPressed: () {
_controller.jumpTo(_controller.position.maxScrollExtent);
},
),
);
}まとめ
リストビューで最後の要素を表示するには、ScrolControllerとjumpToメソッドを使用します。
コメント