How to add pull to refresh/ swipe refresh in an Android project in Kotlin:
In this post, I will show you how we can implement pull to refresh in an Android studio project. Pull-to-refresh widget is used in lists like RecyclerView where we don’t have any other way to update the list. For example, if we load one recyclerview with a set of data, and if the data is updated on server, we have to restart the App to fetch and load the new set of data.
Pull-to-refresh enables users to pull down the screen to load new data and update a recyclerview. This widget is commonly used in almost all applications like social media, news etc.
Android Project:
We are using the same android project we used in our previous tutorials. You can check the other past tutorials to learn what we did.
Swipe to refresh is a widget we need to add to our Android project separately. Add the below dependency line to your app level build.gradle file :
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
Sync your project. It will add SwipeRefreshLayout to the Android project.
-
Create one SwipeRefreshLayoue variable in the MainActivity class:
private lateinit var swipeRefresh: SwipeRefreshLayout
-
In the xml file of ActivityMain, i.e. activity_main.xml, add SwipeRefreshLayout component above RecyclerView in the ConstraintLayout :
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <androidx.swiperefreshlayout.widget.SwipeRefreshLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/swipeRefresh"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginStart="1dp" android:layout_marginLeft="1dp" android:layout_marginTop="25dp" android:layout_marginEnd="1dp" android:layout_marginRight="1dp" android:layout_marginBottom="1dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.swiperefreshlayout.widget.SwipeRefreshLayout> </androidx.constraintlayout.widget.ConstraintLayout>
- In the onCreate method of MainActivity, initialize swipeRefresh variable and set one refresh listener to it.
swipeRefresh = findViewById(R.id.swipeRefresh)
swipeRefresh.setOnRefreshListener {
getAllData()
}
So, everything is handled. We just need to use the setOnRefreshListener listener.
But we need to stop the animation once we receive data from the API.
fun getAllData(){
....
if(swipeRefresh.isRefreshing){
swipeRefresh.isRefreshing = false
}
...
....
...
}
Here, we are stopping the refreshing of SwipeRefreshLayout if it is refreshing. It is checked by isRefreshing boolean value and we are assigning it to false to stop the refreshing.
Source code:
You can download the source code from Github here: https://github.com/nkaushikd/recyclerview-kotlin
checkout this tag : tut-swiperefresh
git clone https://github.com/nkaushikd/recyclerview-kotlin.git git checkout tags/tut-swiperefresh
You might also like:
- How to create a basic recyclerview in Android using Kotlin
- How to validate an email in Kotlin in Android
- How to hide soft keyboard in Android (Kotlin) programmatically
- How to change the theme of Android Studio
- Create a recyclerview with image from API in Kotlin Android
- How to delete an item from a recyclerview in Android(Kotlin)