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

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. — Günter Zöchbauer, Jun 27 '18 at 17:37
@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 — Rajesh, Jun 27 '18 at 17:39
@GünterZöchbauer here is the video of that https://www.facebook.com/rajesh.JumpRoper/videos/2129228357301990/ — Rajesh, Jun 27 '18 at 17:40
@GünterZöchbauer Listview.Builder,Just fetching a collection from firebase then showing them as List view — Rajesh, Jun 27 '18 at 17:41
@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 — Rajesh, Jun 27 '18 at 17:56
@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 https://www.youtube.com/watch?v=HVX_uame7K8 — Rajesh, Jun 27 '18 at 18:00

score 25 · Accepted Answer · edited Dec 20 '22 at 00:33

25

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,);
  });

edited Dec 20 '22 at 00:33

Erisan Olasheni

2,395
17
20

answered Jun 27 '18 at 18:15

Jacob Phillips

8,841
3
51
66

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 – Rajesh Jun 27 '18 at 18:37
1

you can still call that function after your results from Firebase change. – Jacob Phillips Jun 27 '18 at 20:20
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, – Rajesh Jun 28 '18 at 09:28
2

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! – Tuco Jun 23 '19 at 05:12
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 – spookymodem Jan 18 '20 at 18:49

Flutter:Scrolling To Bottom Automatically when the screen opens

1 Answers1