How to implement setOnScrollListener in RecyclerView

Question

How Do I show progress bar at bottom when user reached to items those are visible in a list.

I have written a code in which i am getting data using web service, now

Answer 1

Another example. Set you progress bar at bottom and change its visibility according to scrolling/loading and your records. Note: you need to call notifyDataSetChanged(); method to add/refresh data to adapter

  recyclerView.setOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);

                int total = linearLayoutManager.getItemCount();
                int firstVisibleItemCount = linearLayoutManager.findFirstVisibleItemPosition();
                int lastVisibleItemCount = linearLayoutManager.findLastVisibleItemPosition();

                //to avoid multiple calls to loadMore() method
                //maintain a boolean value (isLoading). if loadMore() task started set to true and completes set to false
                if (!isLoading) { 
                    if (total > 0) 
                        if ((total - 1) == lastVisibleItemCount){
                           loadMore();//your HTTP stuff goes in this method 
                           loadingProgress.setVisibility(View.VISIBLE);
                        }else
                           loadingProgress.setVisibility(View.GONE);
                }
            }

            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);

            }

    });

Answer 2

To implement OnScrollListener in Kotlin for RecyclerView, you can use

recyclerViewChat.addOnScrollListener(object : RecyclerView.OnScrollListener() {

            override fun onScrollStateChanged(recyclerView: RecyclerView, newState: Int) {
                super.onScrollStateChanged(recyclerView, newState)
                if (newState == RecyclerView.SCROLL_STATE_IDLE) {
                    Log.d("scroll", "idle")
                } else if (newState == RecyclerView.SCROLL_STATE_SETTLING) {
                    Log.d("scroll", "settling")
                } else if (newState == RecyclerView.SCROLL_STATE_DRAGGING) {
                    Log.d("scroll", "dragging")
                }
            }

            override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
                super.onScrolled(recyclerView, dx, dy)
                Log.d("scroll", "scrolling")
            }
        })

Answer 3

The idea to implement load-more is :

Get all records in one collection. Take another collection which will populate partial records lets say 10 records. Now, when u reach at bottom, populate next 10 records in the collection and notify the list.

So your code will be something like this :

ArrayList<NatureItem> tempList; // which holds partial records
tempList = getList(limit, 10);

mAdapter = new RecyclerViewMaterialAdapter(new CardAdapter(getActivity(), tempList), 2);
mRecyclerView.setAdapter(mAdapter);

Now, code to load next records :

limit += 10;
tempList.addAll(getList(limit, 10));
mAdapter.notifyDataSetChanged();

To show he loader/progress, better to use load-more library

Answer 4

Activity Class with recylcerview in xml layout file

public class WallpaperActivity extends AppCompatActivity implements OnTaskCompleted {


private static final String TAG = "WallpaperActivity";


private Toolbar toolbar;


private RecyclerView mRecyclerView;
private WallPaperDataAdapter mAdapter;
private LinearLayoutManager mLayoutManager;
// to keep track which pages loaded and next pages to load
public static int pageNumber;

private List<WallPaper> wallpaperImagesList;


protected Handler handler;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.wallpaper_main);
    toolbar = (Toolbar) findViewById(R.id.toolbar);
    mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view);
    pageNumber = 1;
    wallpaperImagesList = new ArrayList<WallPaper>();
    handler = new Handler();
    if (toolbar != null) {
        setSupportActionBar(toolbar);
        getSupportActionBar().setTitle("WallPapers");

    }


    // use this setting to improve performance if you know that changes
    // in content do not change the layout size of the RecyclerView
    mRecyclerView.setHasFixedSize(true);


    mLayoutManager = new LinearLayoutManager(this);


    // use a linear layout manager
    mRecyclerView.setLayoutManager(mLayoutManager);


    // create an Object for Adapter
    mAdapter = new WallPaperDataAdapter(wallpaperImagesList, mRecyclerView);

    // set the adapter object to the Recyclerview
    mRecyclerView.setAdapter(mAdapter);


    getWebServiceData();


    mAdapter.setOnLoadMoreListener(new OnLoadMoreListener() {
        @Override
        public void onLoadMore() {
            //add null , so the adapter will check view_type and show progress bar at bottom
            wallpaperImagesList.add(null);
            mAdapter.notifyItemInserted(wallpaperImagesList.size() - 1);
            ++pageNumber;


            getWebServiceData();


        }
    });


}


public void getWebServiceData() {

    BackGroundTask backGroundTask = new BackGroundTask(this, this, pageNumber);
    backGroundTask.execute();

}


@Override
public void onTaskCompleted(String response) {


    parsejosnData(response);

}


public void parsejosnData(String response) {

    try {

        JSONObject jsonObject = new JSONObject(response);

        //    String json = jsonObject.toString();

        JSONArray jsonArray = jsonObject.getJSONArray("wallpapers");


        if (jsonArray != null) {
            // looping through All albums


            if (pageNumber > 1) {
                wallpaperImagesList.remove(wallpaperImagesList.size() - 1);
                mAdapter.notifyItemRemoved(wallpaperImagesList.size());
            }

            for (int i = 0; i < jsonArray.length(); i++) {
                JSONObject c = jsonArray.getJSONObject(i);

                // Storing each json item values in variable
                String id = c.getString("id");
                String orig_url = c.getString("orig_url");
                String thumb_url = c.getString("thumb_url");
                String downloads = c.getString("downloads");
                String fav = c.getString("fav");

                // Creating object for each product
                WallPaper singleWall = new WallPaper(id, orig_url, thumb_url, downloads, fav);

                // adding HashList to ArrayList
                wallpaperImagesList.add(singleWall);


                handler.post(new Runnable() {
                    @Override
                    public void run() {
                       mAdapter.notifyItemInserted(wallpaperImagesList.size());


                    }
                });


            }


            mAdapter.setLoaded();


        } else {
            Log.d("Wallpapers: ", "null");
        }

    } catch (JSONException e) {
        e.printStackTrace();
    }

}


}

Adapter Class

public class WallPaperDataAdapter extends RecyclerView.Adapter {
    private final int VIEW_ITEM = 1;
    private final int VIEW_PROG = 0;

    private List<WallPaper> imagesList;

    // The minimum amount of items to have below your current scroll position
    // before loading more.
    private int visibleThreshold = 5;
    private int lastVisibleItem, totalItemCount;
    private boolean loading;
    private OnLoadMoreListener onLoadMoreListener;


    public WallPaperDataAdapter(List<WallPaper> imagesList1, RecyclerView recyclerView) {
        imagesList = imagesList1;

        if (recyclerView.getLayoutManager() instanceof LinearLayoutManager) {

            final LinearLayoutManager linearLayoutManager = (LinearLayoutManager) recyclerView
                    .getLayoutManager();


            recyclerView
                    .addOnScrollListener(new RecyclerView.OnScrollListener() {
                        @Override
                        public void onScrolled(RecyclerView recyclerView,
                                               int dx, int dy) {
                            super.onScrolled(recyclerView, dx, dy);

                            totalItemCount = linearLayoutManager.getItemCount();
                            lastVisibleItem = linearLayoutManager
                                    .findLastVisibleItemPosition();
                            if (!loading
                                    && totalItemCount <= (lastVisibleItem + visibleThreshold)) {
                                // End has been reached
                                // Do something
                                if (onLoadMoreListener != null) {
                                    onLoadMoreListener.onLoadMore();
                                }
                                loading = true;
                            }
                        }
                    });
        }
    }

    @Override
    public int getItemViewType(int position) {
        return imagesList.get(position) != null ? VIEW_ITEM : VIEW_PROG;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent,
                                                      int viewType) {
        RecyclerView.ViewHolder vh;
        if (viewType == VIEW_ITEM) {
            View v = LayoutInflater.from(parent.getContext()).inflate(
                    R.layout.wallpaper_row, parent, false);

            vh = new WallPaperViewHolder(v);
        } else {
            View v = LayoutInflater.from(parent.getContext()).inflate(
                    R.layout.progress_item, parent, false);

            vh = new ProgressViewHolder(v);
        }
        return vh;
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        if (holder instanceof WallPaperViewHolder) {

            WallPaper singleWallPaper = (WallPaper) imagesList.get(position);


            Glide.with(((WallPaperViewHolder) holder).thumbIcon.getContext())
                    .load(singleWallPaper.getThumbUrl())
                    .centerCrop()
                    .placeholder(R.drawable.bg)
                    .crossFade()
                    .into(((WallPaperViewHolder) holder).thumbIcon);


        } else {
            ((ProgressViewHolder) holder).progressBar.setIndeterminate(true);
        }
    }

    public void setLoaded() {
        loading = false;
    }

    @Override
    public int getItemCount() {
        return imagesList.size();
    }

    public void setOnLoadMoreListener(OnLoadMoreListener onLoadMoreListener) {
        this.onLoadMoreListener = onLoadMoreListener;
    }


    //
    public static class WallPaperViewHolder extends RecyclerView.ViewHolder {


        public ImageView thumbIcon;


        public WallPaperViewHolder(View v) {
            super(v);


            thumbIcon = (ImageView) v.findViewById(R.id.thumbIcon);


        }
    }

    public static class ProgressViewHolder extends RecyclerView.ViewHolder {
        public ProgressBar progressBar;

        public ProgressViewHolder(View v) {
            super(v);
            progressBar = (ProgressBar) v.findViewById(R.id.progressBar1);
        }
    }
}

wallpaper_row.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

<ImageView
    android:id="@+id/thumbIcon"
    android:layout_width="160dp"
    android:layout_height="160dp"
    android:layout_centerInParent="true"
    android:layout_margin="2dp"
    android:gravity="center" />

</RelativeLayout>

progress_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <ProgressBar
        android:id="@+id/progressBar1"
        android:layout_width="wrap_content"
        android:layout_gravity="center"
        android:layout_height="wrap_content" />

</LinearLayout>

Separate BackGroundTask.java

public class BackGroundTask extends AsyncTask<Object, Void, String> {

    private ProgressDialog pDialog;
    public OnTaskCompleted listener = null;//Call back interface


    Context context;
    int pageNumber;

    public BackGroundTask(Context context1, OnTaskCompleted listener1, int pageNumber) {
        context = context1;
        listener = listener1;   //Assigning call back interface  through constructor
        this.pageNumber = pageNumber;
    }

    @Override
    protected void onPreExecute() {
        super.onPreExecute();

    }

    @Override
    protected String doInBackground(Object... params) {

        //My Background tasks are written here

        synchronized (this) {

            String url = Const.URL_WALLPAPERS_HD + pageNumber;
            String jsonStr = ServiceHandler.makeServiceCall(url, ServiceHandler.GET);
            Log.i("Url: ", "> " + url);

            Log.i("Response: ", "> " + jsonStr);
            return jsonStr;
        }

    }

    @Override
    protected void onPostExecute(String result) {
        super.onPostExecute(result);
        listener.onTaskCompleted(result);

    }

}

ServiceHanlder.java

public class ServiceHandler {

    static String response = null;
    public final static int GET = 1;
    public final static int POST = 2;


    public ServiceHandler() {

    }

    /**
     * Making service call
     *
     * @url - url to make request
     * @method - http request method
     */
    public static String makeServiceCall(String url, int method) {
        return makeServiceCall(url, method, null);
    }

    /**
     * Making service call
     *
     * @url - url to make request
     * @method - http request method
     * @params - http request params
     */
    public static String makeServiceCall(String url, int method,
                                  List<NameValuePair> params) {
        try {
            // http client
            DefaultHttpClient httpClient = new DefaultHttpClient();
            HttpEntity httpEntity = null;
            HttpResponse httpResponse = null;

            // Checking http request method type
            if (method == POST) {
                HttpPost httpPost = new HttpPost(url);
                // adding post params
                if (params != null) {
                    httpPost.setEntity(new UrlEncodedFormEntity(params));
                }
                Log.e("Selltis Request URL", url);
                httpResponse = httpClient.execute(httpPost);

            } else if (method == GET) {
                // appending params to url
                if (params != null) {
                    String paramString = URLEncodedUtils
                            .format(params, "utf-8");
                    url += paramString;

                    Log.i("Request URL", url);
                }
                HttpGet httpGet = new HttpGet(url);

                httpResponse = httpClient.execute(httpGet);

            }
            httpEntity = httpResponse.getEntity();
            response = EntityUtils.toString(httpEntity);

        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
            return "Fail";
        } catch (ClientProtocolException e) {
            e.printStackTrace();
            return "Fail";
        } catch (IOException e) {
            e.printStackTrace();
            return "Fail";
        }

        return response;

    }


}

Interface for Load More

public interface OnLoadMoreListener {
     void onLoadMore();
}

Interface to know web service data loaded from asynctask

public interface OnTaskCompleted{

    void onTaskCompleted(String response);
}

Please let me know if this works or any issues for you. Better to use Volley or okHttp Libraries for Networking.

For ImageLoading i used Glide Library.

Answer 5

This is how I detect whether RecyclerView should refresh by OnScrollListener, take a look at it:

recyclerView.setOnScrollListener(new RecyclerView.OnScrollListener() {
    int ydy = 0;
    @Override
    public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
        super.onScrollStateChanged(recyclerView, newState);

    }

    @Override
    public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        super.onScrolled(recyclerView, dx, dy);
        int offset = dy - ydy;
        ydy = dy;
        boolean shouldRefresh = (linearLayoutManager.findFirstCompletelyVisibleItemPosition() == 0)
                && (recyclerView.getScrollState() == RecyclerView.SCROLL_STATE_DRAGGING) && offset > 30;
        if (shouldRefresh) {
            //swipeRefreshLayout.setRefreshing(true);
            //Refresh to load data here.
            return;
        }
        boolean shouldPullUpRefresh = linearLayoutManager.findLastCompletelyVisibleItemPosition() == linearLayoutManager.getChildCount() - 1
                && recyclerView.getScrollState() == RecyclerView.SCROLL_STATE_DRAGGING && offset < -30;
        if (shouldPullUpRefresh) {
            //swipeRefreshLayout.setRefreshing(true);
            //refresh to load data here.
            return;
        }
        swipeRefreshLayout.setRefreshing(false);
    }
});

Hope you'll be inspired. Good luck~

Answer 6

In the onScroll method

if (!loading && (totalItemCount - visibleItemCount)
        <= (firstVisibleItem + visibleThreshold)) {
    // End has been reached

    Log.i("...", "end called");

    // Do something
    new JSONAsyncTask().execute("http://walldroidhd.com/api.php");

    loading = true;
}