Swipe/Pull to refresh RecyclerView
In this tutorial, we’re going to see how to implement swipe to refresh layout inside the recyclerView that is when you swipe from top to bottom your recyclerView would be refreshed. And if you’re not going through my previous tutorial on recyclerView, you can click here, or if you’re familiar with it then just follow these steps to implement swipe layout for our recyclerView.
Earlier we’re created our RecyclerView XML and Java file, item row with the RecyclerView Adapter. Please go through these otherwise, we will not understand this tutorial.
But now for Swipe Layout, we need to do some changes to our main XML file. Not in the item row XML file. Item row XML is the same as before.
Here we’ll compare our XML file after and before applying the swiping layout.
Before applying the Swipe Layout
activity_main.xml
<?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.recyclerview.widget.RecyclerView
android:id=”@+id/recyclerView”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
app:layout_constraintBottom_toBottomOf=”parent”
app:layout_constraintEnd_toEndOf=”parent”
app:layout_constraintStart_toStartOf=”parent”
app:layout_constraintTop_toTopOf=”parent” />
</androidx.constraintlayout.widget.ConstraintLayout>
After applying the Swipe Layout
activity_main.xml
<?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:id=”@+id/swipeRefresh”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
app:layout_constraintBottom_toBottomOf=”parent”
app:layout_constraintEnd_toEndOf=”parent”
app:layout_constraintStart_toStartOf=”parent”
app:layout_constraintTop_toTopOf=”parent”>
<androidx.recyclerview.widget.RecyclerView
android:id=”@+id/recyclerView”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
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>
- Here we add a swipe refresh layout and put our recyclerView inside it. So that when we swipe top to bottom our recyclerView would be changed.
- Now we need to create our Swipe refresh layout inside the main activity java file at the top.
SwipeRefreshLayout swipeRefreshLayout;
- And inside onCreate() method we can find our swipe refresh layout.
swipeRefreshLayout = findViewById(R.id.swipeRefresh);
- now, we’ll attach onSwipeRefreshListener() to the swipe refresh layout. After that add some items on our moviesList and off the swipe refresh.
swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
moviesList.add(“Black Window (2020)”);
moviesList.add(“The Eternals (2020)”);
moviesList.add(“Shang-Chi and the Legend of the Ten Rings (2021)”);
moviesList.add(“Doctor Strange in the Multiverse of Madness (2021)”);
moviesList.add(“Thor: Love and Thunder (2021)”);
recyclerAdapter.notifyDataSetChanged();
swipeRefreshLayout.setRefreshing(false);
}
});
recyclerAdapter.notifyDataChanged() will notify the recyclerView that list is changed.
MainActivity.java
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.DividerItemDecoration;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import androidx.swiperefreshlayout.widget.SwipeRefreshLayout;
import android.os.Bundle;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity implements RecyclerViewClickInterface{
RecyclerView recyclerView;
RecyclerAdapter recyclerAdapter;
List<String> moviesList;
SwipeRefreshLayout swipeRefreshLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
moviesList = new ArrayList<>();
recyclerView = findViewById(R.id.recyclerView);
recyclerAdapter = new RecyclerAdapter(moviesList, this);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
recyclerView.setAdapter(recyclerAdapter);
DividerItemDecoration dividerItemDecoration = new DividerItemDecoration(this, DividerItemDecoration.VERTICAL);
recyclerView.addItemDecoration(dividerItemDecoration);
moviesList.add(“Captain America”);
moviesList.add(“The Fantastic Four”);
moviesList.add(“Howard the Duck”);
moviesList.add(“Blade”);
moviesList.add(“X-Men”);
moviesList.add(“Spider-Man”);
moviesList.add(“Daredevil”);
moviesList.add(“Hulk”);
moviesList.add(“The Punisher”);
moviesList.add(“Ghost Rider”);
moviesList.add(“Iron Man”);
moviesList.add(“Thor”);
moviesList.add(“The Avengers”);
moviesList.add(“Guardians of the Galaxy”);
moviesList.add(“Ant-Man”);
moviesList.add(“Deadpool”);
moviesList.add(“Doctor Strange”);
moviesList.add(“Logan”);
moviesList.add(“Black Panther”);
moviesList.add(“Venom”);
moviesList.add(“Dark Phoenix”);
moviesList.add(“The New Mutants”);
//swipe to refresh code
swipeRefreshLayout = findViewById(R.id.swipeRefresh);
swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
moviesList.add(“Black Window (2020)”);
moviesList.add(“The Eternals (2020)”);
moviesList.add(“Shang-Chi and the Legend of the Ten Rings (2021)”);
moviesList.add(“Doctor Strange in the Multiverse of Madness (2021)”);
moviesList.add(“Thor: Love and Thunder (2021)”);
recyclerAdapter.notifyDataSetChanged();
swipeRefreshLayout.setRefreshing(false);
}
});
}
@Override
public void onItemClick(int position) {
Toast.makeText(this, moviesList.get(position), Toast.LENGTH_SHORT).show();
}
@Override
public void onLongItemClick(int position) {
Toast.makeText(this, moviesList.get(position) + “ Removed”, Toast.LENGTH_SHORT).show();
moviesList.remove(position);
recyclerAdapter.notifyItemRemoved(position);
}
}
Output
