Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Focus the bottom of a ListView ? Flutter

If I add items dynamically to a listView with a listView.builder, how do I keep the bottom of the list focus ? Like if the list is full, and I add an Item, how do I do to make the other go up and focus the last item without deleting anything ?

like image 587
Simon B Avatar asked Dec 07 '25 08:12

Simon B


2 Answers

Hi you can take help of ScrollController using method jumpTo() or animateTo() like bellow,

First create instance of

ScrollController controller = new ScrollController();

Then after registering it with your listview like bellow example

ListView.builder(
              itemBuilder: (context, index) => ListTile(
                title: Text("Item List"),
              ),
              controller: controller,
              itemCount: 50,
            ),

And finally call jumTo() or animateTo() method when new item added or whenever you want to go at bottom like bellow

controller.jumpTo(controller.position.maxScrollExtent);
like image 195
Dhaval Solanki Avatar answered Dec 08 '25 21:12

Dhaval Solanki


The Accepted answer is correct but also this answer will be useful,

//Controller

ScrollController _scrollController = new ScrollController();

//Add this controller to list

ListView.builder(
      controller: _scrollController, //The Controller
      shrinkWrap: true,
      reverse: false,
      itemCount: snapshot.data.documents.length,
      itemBuilder: (context, index) {
      //Your Widgets
 })

// Add this to everytime you want to scroll to the bottm of list

_scrollController.animateTo(
        _scrollController.position.maxScrollExtent,
        curve: Curves.easeOut,
        duration: const Duration(milliseconds: 300),
);
like image 36
gsm Avatar answered Dec 08 '25 21:12

gsm