Drag and Swipe with RecyclerView

Part One: Basic ItemTouchHelper Example

5 min readJun 23, 2015

June 23, 2015

There are many tutorials, libraries, and examples for implementing “drag & drop” and “swipe-to-dismiss” in Android, using RecyclerView. Most are still using the old View.OnDragListener, and Roman Nurik’s SwipeToDismiss approach, even though there are newer, and better, methods available. A few use the newer APIs, but often rely on GestureDetectors and onInterceptTouchEvent, or the implementation is complex. There’s actually a really simple way to add these features to RecyclerView. It only requires one class, and it’s already part of the Android Support Library:

ItemTouchHelper

ItemTouchHelper is a powerful utility that takes care of everything you need to add both drag & drop and swipe-to-dismiss to your RecyclerView. It’s a subclass of RecyclerView.ItemDecoration, which means it’s easily added to almost-any existing LayoutManager and Adapter(!). It also works with existing item animations, and gives you type-restricted dragging, drop settling animations, and much more. In this article, I’ll demonstrate a simple implementation of ItemTouchHelper. Later, in this series, we’ll expand the scope and explore more features.

Skip ahead

Just interested in seeing the completed source? Jump to Github: Android-ItemTouchHelper-Demo. The first commit lines up with this article. Download the demo apk from here.

Setting up

First thing we need is a basic RecyclerView setup. If you haven’t already, update your build.gradle to include the RecyclerView dependency.

compile 'com.android.support:recyclerview-v7:22.2.0'

ItemTouchHelper will work with almost any RecyclerView.Adapter and LayoutManager, but the article will build off the basic files found in this Gist:

https://gist.github.com/iPaulPro/2216ea5e14818056cfcc

Using ItemTouchHelper and ItemTouchHelper.Callback

In order to use ItemTouchHelper, you’ll create an ItemTouchHelper.Callback. This is the interface that allows you to listen for “move” and “swipe” events. It’s also where you are able to control the state of the view selected, and override the default animations. There’s a helper class that you can use if you want a basic implementation, SimpleCallback, but for the purposes of learning how it works, we’ll make our own.

The main callbacks that we must override to enable basic drag & drop and swipe-to-dismiss are:

getMovementFlags(RecyclerView, ViewHolder)onMove(RecyclerView, ViewHolder, ViewHolder)onSwiped(ViewHolder, int)

We’ll also use a couple of helpers:

isLongPressDragEnabled()isItemViewSwipeEnabled()

We’ll go through them one by one.

@Override
public int getMovementFlags(RecyclerView recyclerView, 
        RecyclerView.ViewHolder viewHolder) {
    int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN;
    int swipeFlags = ItemTouchHelper.START | ItemTouchHelper.END;
    return makeMovementFlags(dragFlags, swipeFlags);
}

ItemTouchHelper allows you to easily determine the direction of an event. You must override getMovementFlags() to specify which directions of drags and swipes are supported. Use the helper ItemTouchHelper.makeMovementFlags(int, int) to build the returned flags. We’re enabling dragging and swiping in both directions here.

@Override
public boolean isLongPressDragEnabled() {
    return true;
}

ItemTouchHelper can be used for drag without swipe (or vice versa), so you must designate exactly what you wish to support. Implementations should return true from isLongPressDragEnabled() in order to support starting drag events from a long press on a RecyclerView item. Alternatively, ItemTouchHelper.startDrag(RecyclerView.ViewHolder) can be called to start a drag from a “handle.” This will be explored further later.

@Override
public boolean isItemViewSwipeEnabled() {
    return true;
}

To enable swiping from touch events that start anywhere within the view, simply return true from isItemViewSwipeEnabled(). Alternatively, ItemTouchHelper.startSwipe(RecyclerView.ViewHolder) can be called to start a drag manually.

The next two, onMove() and onSwiped() are needed to notify anything in charge of updating the underlying data. So first we’ll create an interface that allows us to pass these event callbacks back up the chain.

public interface ItemTouchHelperAdapter {

    void onItemMove(int fromPosition, int toPosition);

    void onItemDismiss(int position);
}

ItemTouchHelperAdapter.java Gist

The simplest way to do this, for the sake of this example, is to have our RecyclerListAdapter implement the listener.

public class RecyclerListAdapter extends 
        RecyclerView.Adapter<ItemViewHolder> 
        implements ItemTouchHelperAdapter {// ... code from gist@Override
public void onItemDismiss(int position) {
    mItems.remove(position);
    notifyItemRemoved(position);
}

@Override
public boolean onItemMove(int fromPosition, int toPosition) {
    if (fromPosition < toPosition) {
        for (int i = fromPosition; i < toPosition; i++) {
            Collections.swap(mItems, i, i + 1);
        }
    } else {
        for (int i = fromPosition; i > toPosition; i--) {
            Collections.swap(mItems, i, i - 1);
        }
    }
    notifyItemMoved(fromPosition, toPosition);
    return true;
}

It’s very important to call notifyItemRemoved() and notifyItemMoved() so the Adapter is aware of the changes. It’s also important to note that we’re changing the position of the item every time the view is shifted to a new index, and not at the end of a “drop” event.

Now we can go back to building our SimpleItemTouchHelperCallback as we still must override onMove() and onSwiped(). First add a constructor and a field for the Adapter:

private final ItemTouchHelperAdapter mAdapter;

public SimpleItemTouchHelperCallback(
        ItemTouchHelperAdapter adapter) {
    mAdapter = adapter;
}

Then override the remaining events and notify the adapter:

@Override
public boolean onMove(RecyclerView recyclerView, 
        RecyclerView.ViewHolder viewHolder, 
        RecyclerView.ViewHolder target) {    mAdapter.onItemMove(viewHolder.getAdapterPosition(), 
            target.getAdapterPosition());    return true;
}@Override
public void onSwiped(RecyclerView.ViewHolder viewHolder, 
        int direction) {
    mAdapter.onItemDismiss(viewHolder.getAdapterPosition());
}

The resulting Callback class should look something like this:

With our Callback ready, we can create our ItemTouchHelper and call attachToRecyclerView(RecyclerView) (e.g. in MainFragment.java):

ItemTouchHelper.Callback callback = 
    new SimpleItemTouchHelperCallback(adapter);
ItemTouchHelper touchHelper = new ItemTouchHelper(callback);
touchHelper.attachToRecyclerView(recyclerView);

When you run, it should look something like this:

Conclusion

This is a bare-bones implementation of ItemTouchHelper. However, it should be clear that a third-party library is not needed for basic drag & drop and swipe-to-dismiss with RecyclerView. In the next part, we’ll take more control over the appearance of the items while being dragged or swiped.

Source code

I created a project on GitHub to demonstrate the things covered in this article series: Android-ItemTouchHelper-Demo. The first commit corresponds to this part, and also has a bit of part 2 in it .

Next Parts

Part Two: Handles, Grids, and Custom Animations

Follow me on Twitter

All code appearing in this article is licensed under Apache 2.0