Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter NotificationListener with ScrollNotification vs ScrollController

Tags:

There are two options to retrieve the scroll position for a CustomScrollView. The documentation states the following:

ScrollNotification and NotificationListener, which can be used to watch the scroll position without using a ScrollController.

So we have the following options:

  1. NotificationListener with ScrollNotification
  2. ScrollController

In which situation do you useNotificationListener with ScrollNotification vs ScrollController?

Thank you :)

like image 301
Renato Stauffer Avatar asked Dec 30 '17 16:12

Renato Stauffer


People also ask

What is ScrollController in Flutter?

A ScrollController is a Listenable. It notifies its listeners whenever any of the attached ScrollPositions notify their listeners (i.e. whenever any of them scroll). It does not notify its listeners when the list of attached ScrollPositions changes. Typically used with ListView, GridView, CustomScrollView.

How do you limit scrolls in Flutter?

You need to add a padding to your ListView in order to offset the scroll boundary into the screen.

What is scroll offset Flutter?

The pixels value determines the scroll offset that the scroll view uses to select which part of its content to display. As the user scrolls the viewport, this value changes, which changes the content that is displayed. The ScrollPosition applies physics to scrolling, and stores the minScrollExtent and maxScrollExtent.


1 Answers

If you're using NestedScrollView with nested scrollers, using a scrollController on the inner scrollers will break the link with NestedScrollView meaning NestedScrollView will no longer control the complete scrolling experience. To get information about the scroll positions of the inner scrollers in this case you would use a NotificationListener with ScrollNotification.

NotificationListener<ScrollNotification>(   child: ListView.builder(     itemCount: 10     itemBuilder: (BuildContext context, int index) {       return Text('Item $index');     },   ),   onNotification: (ScrollNotification scrollInfo) {     if (scrollInfo.metrics.pixels ==         scrollInfo.metrics.maxScrollExtent) {       onLoadMore();     }   }, ); 

Related Answer here.

like image 51
Michael Tedla Avatar answered Sep 19 '22 15:09

Michael Tedla