Flutter:Scrolling To Bottom Automatically when the screen opens

Question

I'm using onpressed() to scroll down to bottom of the List view, but i want to achieve that without Pressing the botton,

It must autoscroll for every screen opening. I tried to put it inside initState() its not working but if i press the button it wokrks

How to make it autoScroll?

Working code:

 floatingActionButton: new FloatingActionButton(child: 
 Icon(Icons.arrow_downward),onPressed:_hola,)



_hola(){
  print("inti state started successfully");
controller1.animateTo(
controller1.position.maxScrollExtent,
  duration: const Duration(milliseconds: 10),
   curve: Curves.easeOut,);
}

Non Working Code: //This code prints successfully,but not really calling the function

class HomeState extends State<MyNewMessages> {
  @override
  void initState() 
{
 super.initState();
  print("hola is scrolling");
  _hola;
}
);
}

Before Pressing Floating Button After Pressing Floating Button

Endodontist

Check if the list your are using has a reverse constructor parameter and pass true, then it will scroll to the bottom automatically. You need to query the data in reverse order as well. – Polemic

@GünterZöchbauer yes i'm using the reverse only, the problm is its no scrolling to the bottom of the full list,it hides some data,my list has 14 entries but it shows only 8 entries,this happens even if i use reverse=false – Endodontist

Sounds weird. What list are you using? – Polemic

@GünterZöchbauer here is the video of that facebook.com/rajesh.JumpRoper/videos/2129228357301990 – Endodontist

@GünterZöchbauer Listview.Builder,Just fetching a collection from firebase then showing them as List view – Endodontist

Works fine for me with reverse: true. – Polemic

@GünterZöchbauer yes i'm sorry for the mis uderstanding,it works well for me too,but i'm sorting my entries by Numbers but i want to show the hieghest number at the top of my list, so i used reverse=true,it shows Number "1" in bottom,and upto number "8" in top,but i need to scroll to the very top of the List inorder to show "14"..it scrolls when i press Floating button,but i want to do the scrolling Automatically??When i put the controller codes inside initstae() its not working – Endodontist

@GünterZöchbauer here is the proper video,in revers=true,it shows only to "8" entries but i want to make an auto scroll youtube.com/watch?v=HVX_uame7K8 – Endodontist

Answer 1

When building your ListView or adding an item (not sure how you're doing it), use SchedulerBinding.instance.addPostFrameCallback to change the scroll position on the next frame.

SchedulerBinding.instance.addPostFrameCallback((_) {
  controller1.animateTo(
    controller1.position.maxScrollExtent,
    duration: const Duration(milliseconds: 10),
    curve: Curves.easeOut,);
  });

Massachusetts

Philips,tried ur code,it doesn't worked because i'mnot adding manual entries,im fetching a collection from Firebase then creating a Listview Builder,it scrolls to the desired position while im tapping the button,but i want an autoamated scroll for every page opening – Endodontist

you can still call that function after your results from Firebase change. – Massachusetts

Philips thanks i will try that method,but i have solved that issue with a temporary fix,I just reversed the sorting values from firebase, – Endodontist

I don't usually say thanks here but this time I must say a big THANK YOU to @JacobPhillips for this solution! I spent a few hours trying to accomplish this result and the SchedulerBinding (which was completely new to me) made my day. Thanks dude! – Secretariat

Thank you, @JacobPhillips! I've spent hours and hours over a period of weeks trying to come up with a solution to this problem. Using addPostFrameCallback of ScheduleBinding is getting the job done – Stria

Answer 2

this is the solution i have found after long search:

_scrollController.animateTo(
        _scrollController.position.maxScrollExtent,
        duration: Duration(seconds: 2),
        curve: Curves.fastOutSlowIn,
      );

u can put this code in the initState() like this:

@override

void initState() { super.initState();

new Future.delayed(
  Duration.zero,
      () {
    _scrollController.addListener(_scrollListener);
    _scrollController.animateTo(
      _scrollController.position.maxScrollExtent,
      duration: Duration(seconds: 2),
      curve: Curves.fastOutSlowIn,
    );
  },
);

}

and make sure that the scroll controller u are using is in the correct place, as u may be using a SingleChildScrollView and a shrinked ListView at teh same time, so in this case u have to put the _scrollController in SingleChildScrollView not in the ListView:)

Recant