Tous les articles

RecyclerView – Drap and Drop et Swipe

Aujourd’hui, nous allons voir comment réaliser un Drag and Drop et un Swipe dans un RecyclerView. Je te préviens d’avance, c’est d’une simplicité déconcertante ! Mais avant ça, je t’invite à aller voir mon article qui explique ce qu’est un RecyclerView si tu n’es pas familier avec ce widget.

Nous allons voir deux notions :

  • Drag and Drop : ce qui va nous permettre de modifier l’ordre des items de notre liste en déplacement les éléments simplement avec le doigt
  • Swipe : Supprimer un item de notre liste en le faisant glisser sur le côté

Ces deux notions peuvent paraître compliqués à mettre en place, mais le RecyclerView est un widget très puissant qui nous permet d’effectuer des actions complexes comme celle-ci très facilement. En effet, tout le code pour faire un Drag and Drop et un Swipe tiens sur 12 lignes !

 

Le fichier MainActivity.java :

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.DividerItemDecoration;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;

import java.util.ArrayList;
import java.util.Collections;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RecyclerView.LayoutManager layoutManager;
    private IngredientAdapter ingredientAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // On initialise notre liste de données
        List<Ingredient> listeCourse = new ArrayList<>();
        listeCourse.add(new Ingredient("Oranges", "4"));
        listeCourse.add(new Ingredient("Tomates", "2"));
        listeCourse.add(new Ingredient("Raisin", "Une grappe"));
        listeCourse.add(new Ingredient("Pain", "1/2"));
        listeCourse.add(new Ingredient("Banane", "2 ou 3"));
        listeCourse.add(new Ingredient("Kiwi", "2 ou 3"));
        listeCourse.add(new Ingredient("Pates", "500g"));
        listeCourse.add(new Ingredient("Raviolis", "Une boite"));
        listeCourse.add(new Ingredient("Fraises", "500g"));
        listeCourse.add(new Ingredient("Glace", "1L"));
        listeCourse.add(new Ingredient("Pizza", "1"));
        listeCourse.add(new Ingredient("Yaourts", "6"));
        listeCourse.add(new Ingredient("Riz", "1kg"));
        listeCourse.add(new Ingredient("Haricots", "500g"));

        // On récupère notre RecyclerView via son id
        recyclerView = findViewById(R.id.ingredient_recyclerview);

        // On veut un RecyclerView qui utilise un LinearLayoutManager
        layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);

        // On donne notre adapter à notre RecyclerView
        ingredientAdapter = new IngredientAdapter(this, listeCourse);
        recyclerView.setAdapter(ingredientAdapter);

        // On sépare chaque ligne de notre liste par un trait
        DividerItemDecoration dividerItemDecoration = new DividerItemDecoration(recyclerView.getContext(), DividerItemDecoration.VERTICAL);
        recyclerView.addItemDecoration(dividerItemDecoration);

        // Drag and drop / Swipe
        ItemTouchHelper.Callback itemToucherHelperCallback = new ItemTouchHelper.Callback() {
            @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);
            }

            @Override
            public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
                Collections.swap(ingredientAdapter.listeIngredient, viewHolder.getAdapterPosition(), target.getAdapterPosition());
                ingredientAdapter.notifyItemMoved(viewHolder.getAdapterPosition(), target.getAdapterPosition());
                return true;
            }

            @Override
            public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
                int position = viewHolder.getAdapterPosition();
                ingredientAdapter.listeIngredient.remove(position);
                ingredientAdapter.notifyItemRemoved(position);
            }
        };
        ItemTouchHelper itemTouchHelper = new ItemTouchHelper(itemToucherHelperCallback);
        itemTouchHelper.attachToRecyclerView(recyclerView);
    }
}

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *