Adding Swipe Gestures to RecyclerViews

A big part of Material Design is the way users get to interact with the visual elements of an app. Therefore, in addition to taps and long presses, a well-made Android app today is expected to handle more complex touch such as swipes and drags. This is especially important if the app uses lists to display its data.

serverpoint hosting banner

By using the RecyclerView widget, and a few other Android Jetpack components, you can handle a wide variety of list-related swipe gestures in your apps. Furthermore, in just a few lines of code, you can associate Material Motion animations with those gestures.

In this tutorial, I’ll show you how to add a few common swipe gestures, complete with intuitive animations, to your lists.

Prerequisites

To be able to make the most of this tutorial, you’ll need:

  • Android Studio 3.2.1 or higher
  • a phone or tablet running Android API level 23 or higher

1. Creating a List

To keep this tutorial short, let’s use one of the templates available in Android Studio to generate our list.

Start by launching Android Studio and creating a new project. In the project creation wizard, make sure you choose the Empty Activity option.

Project creation wizard

Instead of the Support library, we’ll be using Android Jetpack in this project. So, once the project has been generated, go to Refactor > Migrate to AndroidX. When prompted, press the Migrate button.

Confirmation prompt for proceeding with migration

Next, to add a list to the project, go to File > New > Fragment > Fragment (List). In the dialog that pops up, go ahead and press the Finish button without making any changes to the default values.

List fragment creation wizard

At this point, Android Studio will create a new fragment containing a fully configured RecyclerView widget. It will also generate dummy data to display inside the widget. However, you’ll still have to add the fragment to your main activity manually.

To do so, first add the OnListFragmentInteractionListener interface to your main activity and implement the only method it contains.

Next, embed the fragment inside the activity by adding the following  tag to the activity_main.xml file:

At this point, if you run your app, you should be able to see a list that looks like this:

App displaying a simple list

2. the -to-Remove Gesture

Using the ItemTouchHelper class, you can quickly add swipe and drag gestures to any RecyclerView widget. The class also provides default animations that run automatically whenever a valid gesture is detected.

The ItemTouchHelper class needs an instance of the abstract ItemTouchHelper.Callback class to be able to detect and handle gestures. Although you can use it directly, it’s much easier to use a wrapper class called SimpleCallback instead. It’s abstract too, but you’ll have fewer methods to override.

Create a new instance of the SimpleCallback class inside the onCreateView() method of the ItemFragment class. As an argument to its constructor, you must pass the direction of the swipe you want it to handle. For now, pass RIGHT to it so that it handles the swipe-right gesture.

You might also like More from author

Leave A Reply

Your email address will not be published.