Last Updated:

SwipeRefreshLayout in Android | Examples

SwipeRefreshLayout in Android

In this tutorial, we'll look at a component and implement it in a simple Android app. We will study the advantages and find out where it is better to use it. The component works on the principle of "swipe down to perform some function (update the Android component or visually display a request to the server). The component is part of Android Material Design and is used in many applications, for example, in Twitter, Gmail, Facebook.

SwipeRefreshLayoutSwipeRefreshLayoutSwipeRefreshLayout

Overview of the SwipeRefreshLayout container in Android

A container is a ViewGroup that can work with only one child element. This element can be, for example, a ScrollView, a ListView, or a RecyclerView. The container is needed so that users can refresh the screen manually. Previously, there was no separate component that would not be responsible for this, so I had to create my own bicycles with the detection of vertical swipes (finger movement on the screen). You can see an example of this when you refresh your feed in the Twitter app.

SwipeRefreshLayoutSwipeRefreshLayout

Example of using SwipeRefreshLayout in Android

First of all, let's add the necessary dependencies to our project. Go to the file and add the following line in the dependencies section:

build.gradle (Module: app)

 

Note that I have buildTools version 24 installed, so I can mount version 24.0.0 of the RecyclerView library. Use the version of the library that suits you.

Now let's work on the layout of the activity_main.xml, in which we describe the widget from the v4 library and insert a single child element into it - RecyclerView from the design library:

SwipeRefreshLayout

We'll also create a layout file that is responsible for representing a single item in the RecyclerView list. The contents of the item_row.xml file are shown below:

To process the data and pass it for rendering in RecyclerView, we'll need an adapter class with an implementation of the ViewHolder pattern:

 

A comment on the code. In our adapter class, the roles are clearly distributed:

In the constructor, we pass the context and data for processing, in the method the object is created from the layout file, and in the method the content is drawn by position. It all works using the pattern.onCreateViewHolder()ViewonBindViewHolder()ViewHolder

 

Now in the MainActivity class.java we initialize the widgets and override the interface method with the function of adding an item to the list:SwipeRefreshLayoutonRefreshOnRefreshListener

Now let's run the project on the device or emulator and see what happened as a result:

 

Here, the user makes a vertical swipe down (pulls the list down the screen) and a round widget with an arrow appears on top of the list items - this is already the responsibility of SwipeRefreshLayout.

 

In this picture, you can see that 3 generated elements were added to the initial list of 10 elements. This means that the user has made a vertical swipe three times.

In this article, we implemented a simple application that can add some items to the list at the user's request, namely, by swiping inside the component.SwipeRefreshLayout

 

A working project with all the codes can be downloaded here.

 

Follow the updates of the Android Development section and subscribe to new articles of the site p-qc.com!