Android swipe to delete recyclerview example

A Recyclerview is an advanced and flexible version of  a listview. RecyclerView ViewGroup is a container for larger data set of views that can be recycled and scrolled very efficiently. For using RecyclerView you need to specify an  adapter and layout manager also. A layout manager positions items views inside a recyclerview and determines when to reuse that item when it no longer visible to user.

If you are not familiar with how to implement a recyclerview in android please refer Android RecyclerView Example before start implementing this  task which is a tutorial which will explain what is a recycler view and how to implement recycler view in android.In this tutorial we will learn how to implement swipe to delete functionality for the recyclerview

Steps

  1. Create new project in android studio
  2. Implement the recyclerview in your project
  3. Add the code for swipe to delete
android-swipe-to-delete
android-swipe-to-delete

Contents

  1. Code for swipe left
  2. Code for swipe right
  3. Show background layout with icons like in Gmail App.
  4. Complete code

Create New project in android studio

Refer Android beginners app development guide if you are beginner or if you don’t know how to create project in android studio.

Implement the recyclerview in your project

Refer Android RecyclerView Example if you are not familiar with implementing a recyclerview in android.

Add the code for swipe to delete in recyclerview 

Assume that the reference for the recyclerview in your project is as follows

RecyclerView  your_recycler_view= (RecyclerView) findViewById(R.id.your_recycler_view);

Now just add the following code in the same file

ItemTouchHelper.SimpleCallback simpleCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT) {
@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
return false;
}

@Override
public void onSwiped(final RecyclerView.ViewHolder viewHolder, int direction) {
final int position = viewHolder.getAdapterPosition(); //swiped position

if (direction == ItemTouchHelper.LEFT) { //swipe left

yourarraylist.remove(position);
youradapter.notifyItemRemoved(position);

Toast.makeText(getApplicationContext(),"Swipped to left",Toast.LENGTH_SHORT).show();

}else if(direction == ItemTouchHelper.RIGHT){//swipe right

yourarraylist.remove(position);
youradapter.notifyItemRemoved(position);

Toast.makeText(getApplicationContext(),"Swipped to right",Toast.LENGTH_SHORT).show();

}

}
};
ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleCallback);
itemTouchHelper.attachToRecyclerView(your_recycler_view);

Now if you simply want to swipe into only one direction use the following code

For left Swipe

ItemTouchHelper.SimpleCallback simpleCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.LEFT) {
@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
return false;
}

@Override
public void onSwiped(final RecyclerView.ViewHolder viewHolder, int direction) {
final int position = viewHolder.getAdapterPosition(); //swiped position

if (direction == ItemTouchHelper.LEFT) { //swipe left

yourarraylist.remove(position);
youradapter.notifyItemRemoved(position);

Toast.makeText(getApplicationContext(),"Swipped to left",Toast.LENGTH_SHORT).show();

}
}
};
ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleCallback);
itemTouchHelper.attachToRecyclerView(your_recycler_view);

For right swipe

ItemTouchHelper.SimpleCallback simpleCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.RIGHT) {
@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
return false;
}

@Override
public void onSwiped(final RecyclerView.ViewHolder viewHolder, int direction) {
final int position = viewHolder.getAdapterPosition(); //swiped position

 if(direction == ItemTouchHelper.RIGHT){//swipe right

yourarraylist.remove(position);
youradapter.notifyItemRemoved(position);

Toast.makeText(getApplicationContext(),"Swipped to right",Toast.LENGTH_SHORT).show();

}

}
};
ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleCallback);
itemTouchHelper.attachToRecyclerView(your_recycler_view);

Showing background layout with icons like Gmail Application

Next we will modify the above code to show a layout when below the recycle items when it is moved to left or right directions. May be you can give icons based on action. It is as simple as adding the following code to the above code.

public static final float ALPHA_FULL = 1.0f;

public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {

    if (actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {

        View itemView = viewHolder.itemView;

        Paint p = new Paint();
        Bitmap icon;

        if (dX > 0) {

//color : left side (swiping towards right)
            p.setARGB(255, 255, 0, 0);
            c.drawRect((float) itemView.getLeft(), (float) itemView.getTop(), dX,
                    (float) itemView.getBottom(), p);

            // icon : left side (swiping towards right)
            icon = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ic_thumb_down_white_48dp);
            c.drawBitmap(icon,
                    (float) itemView.getLeft() + convertDpToPx(16),
                    (float) itemView.getTop() + ((float) itemView.getBottom() - (float) itemView.getTop() - icon.getHeight())/2,
                    p);
        } else {

            //color : right side (swiping towards left)
            p.setARGB(255, 0, 255, 0);

            c.drawRect((float) itemView.getRight() + dX, (float) itemView.getTop(),
                    (float) itemView.getRight(), (float) itemView.getBottom(), p);

            //icon : left side (swiping towards right)
            icon = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ic_thumb_up_white_48dp);
            c.drawBitmap(icon,
                    (float) itemView.getRight() - convertDpToPx(16) - icon.getWidth(),
                    (float) itemView.getTop() + ((float) itemView.getBottom() - (float) itemView.getTop() - icon.getHeight())/2,
                    p);
        }

        // Fade out the view when it is swiped out of the parent
        final float alpha = ALPHA_FULL - Math.abs(dX) / (float) viewHolder.itemView.getWidth();
        viewHolder.itemView.setAlpha(alpha);
        viewHolder.itemView.setTranslationX(dX);

    } else {
        super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
    }
}

private int convertDpToPx(int dp){
    return Math.round(dp * (getResources().getDisplayMetrics().xdpi / DisplayMetrics.DENSITY_DEFAULT));
}

After adding this our complete code will be as follows

ItemTouchHelper.SimpleCallback simpleCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT) {
    @Override
    public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
        return false;
    }

    public static final float ALPHA_FULL = 1.0f;

    public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {

        if (actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {

            View itemView = viewHolder.itemView;

            Paint p = new Paint();
            Bitmap icon;

            if (dX > 0) {

                //color : left side (swiping towards right)
                p.setARGB(255, 255, 0, 0);
                c.drawRect((float) itemView.getLeft(), (float) itemView.getTop(), dX,
                        (float) itemView.getBottom(), p);

                // icon : left side (swiping towards right)
                icon = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ic_thumb_down_white_48dp);
                c.drawBitmap(icon,
                        (float) itemView.getLeft() + convertDpToPx(16),
                        (float) itemView.getTop() + ((float) itemView.getBottom() - (float) itemView.getTop() - icon.getHeight())/2,
                        p);
            } else {

                //color : right side (swiping towards left)
                p.setARGB(255, 0, 255, 0);

                c.drawRect((float) itemView.getRight() + dX, (float) itemView.getTop(),
                        (float) itemView.getRight(), (float) itemView.getBottom(), p);

                //icon : left side (swiping towards right)
                icon = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ic_thumb_up_white_48dp);
                c.drawBitmap(icon,
                        (float) itemView.getRight() - convertDpToPx(16) - icon.getWidth(),
                        (float) itemView.getTop() + ((float) itemView.getBottom() - (float) itemView.getTop() - icon.getHeight())/2,
                        p);
            }

            // Fade out the view when it is swiped out of the parent
            final float alpha = ALPHA_FULL - Math.abs(dX) / (float) viewHolder.itemView.getWidth();
            viewHolder.itemView.setAlpha(alpha);
            viewHolder.itemView.setTranslationX(dX);

        } else {
            super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
        }
    }

    private int convertDpToPx(int dp){
        return Math.round(dp * (getResources().getDisplayMetrics().xdpi / DisplayMetrics.DENSITY_DEFAULT));
    }
    @Override
    public void onSwiped(final RecyclerView.ViewHolder viewHolder, int direction) {
        final int position = viewHolder.getAdapterPosition(); //swiped position

        if (direction == ItemTouchHelper.LEFT) { //swipe left

            yourarraylist.remove(position);
            youradapter.notifyItemRemoved(position);

            Toast.makeText(getApplicationContext(),"Swipped to left",Toast.LENGTH_SHORT).show();

        }else if(direction == ItemTouchHelper.RIGHT){//swipe right

            yourarraylist.remove(position);
            youradapter.notifyItemRemoved(position);

            Toast.makeText(getApplicationContext(),"Swipped to right",Toast.LENGTH_SHORT).show();

        }

    }
};
ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleCallback);
itemTouchHelper.attachToRecyclerView(your_recycler_view);

About the author

Hi guys, i am the author of codesfor. I am a B.Tech graduate currently working as an App developer. Apart from job i am a blogger and a freelancer.

One Comment

  1. sarala June 1, 2018 Reply

Add a Comment

Your email address will not be published. Required fields are marked *