Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Endless RecyclerView with ProgressBar for pagination

I am using a RecyclerView and fetching objects from an API in batches of ten. For pagination, I use EndlessRecyclerOnScrollListener.

It's all working properly. Now all that's left is to add a progress spinner at the bottom of the list while the next batch of objects is fetched by the API. Here is a screenshot of the Google Play Store app, showing a ProgressBar in what is surely a RecyclerView:

enter image description here

The problem is, neither the RecyclerView nor the EndlessRecyclerOnScrollListener have built-in support for showing a ProgressBar at the bottom while the next batch of objects is being fetched.

I have already seen the following answers:

1. Put an indeterminate ProgressBar as footer in a RecyclerView grid.

2. Adding items to Endless Scroll RecyclerView with ProgressBar at bottom.

I am not satisfied with those answers (both by the same person). This involves shoehorning a null object into the data-set midway while the user is scrolling and then taking it out after the next batch is delivered. It looks like a hack that sidesteps the main problem which may or may not work properly. And it causes a bit of jarring and distortion in the list

Using SwipeRefreshLayout is not a solution here. SwipeRefreshLayout involves pulling from the top to fetch the newest items, and it does not show a progress view anyway.

Can someone please provide a good solution for this? I am interested in knowing how Google has implemented this for their own apps (the Gmail app has it too). Are there any articles where this is shown in detail? All answers & comments will be appreciated. Thank you.

Some other references:

1. Pagination with RecyclerView. (Superb overview ...)

2. RecyclerView header and footer. (More of the same ...)

3. Endless RecyclerView with ProgressBar at bottom.

like image 535
Y.S Avatar asked Dec 23 '15 08:12

Y.S


Video Answer


1 Answers

HERE IS SIMPLER AND CLEANER APPROACH.

Implement Endless Scrolling from this Codepath Guide and then follow the following steps.

1. Add progress bar under the RecyclerView.

    <android.support.v7.widget.RecyclerView         android:id="@+id/rv_movie_grid"         android:layout_width="0dp"         android:layout_height="0dp"         android:paddingBottom="50dp"         android:clipToPadding="false"         android:background="@android:color/black"         app:layout_constraintBottom_toBottomOf="parent"         app:layout_constraintEnd_toEndOf="parent"         app:layout_constraintStart_toStartOf="parent"         app:layout_constraintTop_toTopOf="parent">      </android.support.v7.widget.RecyclerView>      <ProgressBar         android:id="@+id/progressBar"         style="?android:attr/progressBarStyle"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:visibility="invisible"         android:background="@android:color/transparent"         app:layout_constraintBottom_toBottomOf="parent"         app:layout_constraintEnd_toEndOf="parent"         app:layout_constraintStart_toStartOf="parent" /> 

Here android:paddingBottom="50dp" and android:clipToPadding="false" are very important.

2. Get a reference to the progress bar.

progressBar = findViewById(R.id.progressBar); 

3. Define methods to show and hide progress bar.

void showProgressView() {     progressBar.setVisibility(View.VISIBLE); }  void hideProgressView() {     progressBar.setVisibility(View.INVISIBLE); } 
like image 156
Akshar Patel Avatar answered Sep 17 '22 02:09

Akshar Patel