The SwipeRefreshLayout widget is used for implementing a swipe-to-refresh user interface design pattern. It uses a vertical swipe gesture to refresh the content of the views. SwipeRefreshLayout widget detects the vertical swipe and display distinct progress bars and triggers the callback methods in the app. To use this behavior SwipeRefreshLayout widget must be the parent of ListView or GridView. This behavior of the SwipeRefreshLayout widget gives the user to refresh the layout manually. SwipeRefreshLayout class contains a listener called OnRefreshListener. The classes which want to use this listener should implement SwipeRefreshLayout.OnRefreshListener interface. On vertical swipe-down gesture, this listener is triggered and onRefresh() method is called and can be overridden according to the needs.
Swipe-to-Refresh ListView is very much similar to Swipe-to-Refresh RecyclerView. In place of ListView, we use RecyclerView. Please refer to Pull to Refresh with RecyclerView in Android with Example.
Example
In this example, we would store data of string type into the ArrayList which is used for populating the ListView. Whenever OnRefresh() method is called ArrayList data gets shuffled. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language.
Step by Step Implementation
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.
Step 2: Adding dependencies
We are using SwipeRefreshLayout. So, we need to add the dependency for it. For adding the dependency Go to Gradle Scripts > build.gradle(Module: app) and add the following dependency. After adding the dependency you need to click on Sync Now.
dependencies {
implementation ‘androidx.swiperefreshlayout:swiperefreshlayout:1.1.0’
}
Before moving further let’s add some color attributes in order to enhance the app bar. Go to app > res > values > colors.xml and add the following color attributes.
XML
< resources > < color name = "colorPrimary" >#0F9D58</ color > < color name = "colorPrimaryDark" >#16E37F</ color > < color name = "colorAccent" >#03DAC5</ color > </ resources > |
Step 3: Working with the activity_main.xml file
In this step, we will create SwipeRefreshLayout and add ListView to it. Go to app > res > layout > activity_main.xml and add the following code snippet.
XML
<? xml version = "1.0" encoding = "utf-8" ?> < androidx.swiperefreshlayout.widget.SwipeRefreshLayout android:id = "@+id/swipeRefreshLayout" android:layout_width = "match_parent" android:layout_height = "match_parent" tools:context = ".MainActivity" > <!--ListView to store list items--> < ListView android:id = "@+id/listView" android:layout_width = "match_parent" android:layout_height = "match_parent" /> </ androidx.swiperefreshlayout.widget.SwipeRefreshLayout > |
Step 4: Working with the MainActivity.java file
In this step, we get the reference of SwipeRefreshLayout and ListView which we define in our activity_main.xml layout file. We will create an ArrayList of string elements and implement ArrayAdapter in order to set data to the list. And then, we implement setOnRefreshListener event on SwipeRefreshLayout and call OnRefresh() method to shuffle the list elements.
Java
import android.os.Bundle; import android.widget.ArrayAdapter; import android.widget.ListView; import androidx.appcompat.app.AppCompatActivity; import androidx.swiperefreshlayout.widget.SwipeRefreshLayout; import java.util.ArrayList; import java.util.Arrays; import java.util.Collections; import java.util.Random; public class MainActivity extends AppCompatActivity { SwipeRefreshLayout swipeRefreshLayout; ListView listView; ArrayList<String> arrayList = new ArrayList<>(Arrays.asList( "C-Language" , "Java" , "Data Structure" , "Networking" , "Operating System" , "Compiler Design" , "Theory Of Computation" , "Software Engineering" , "Web Engineering" )); @Override protected void onCreate(Bundle savedInstanceState) { super .onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Getting the reference of SwipeRefreshLayout and ListView swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipeRefreshLayout); listView = (ListView) findViewById(R.id.listView); // simple_list_item_1 is a built in layout. It is part of Android OS, instead of creating our own // xml layout we are using built-in layout ArrayAdapter arrayAdapter = new ArrayAdapter( this , android.R.layout.simple_list_item_1, arrayList); listView.setAdapter(arrayAdapter); // Implementing setOnRefreshListener on SwipeRefreshLayout swipeRefreshLayout.setOnRefreshListener( new SwipeRefreshLayout.OnRefreshListener() { @Override public void onRefresh() { swipeRefreshLayout.setRefreshing( false ); // User defined method to shuffle the array list items shuffleListItems(); } }); } public void shuffleListItems() { // Shuffling the arraylist items on the basis of system time Collections.shuffle(arrayList, new Random(System.currentTimeMillis())); ArrayAdapter arrayAdapter = new ArrayAdapter( this , android.R.layout.simple_list_item_1, arrayList); listView.setAdapter(arrayAdapter); } } |