Search code examples
androiddrag-and-dropandroid-recyclerviewandroid-view

Android RecyclerView: drag and drop over multiple ViewType


I implement drag and drop for a RecyclerView, it works well when have one View type but reset the RecyclerView when have multiple view type, I show the result in this gif:
screen recorder

and this is my code:

public class RecyclerListAdapter extends RecyclerView.Adapter<ItemViewHolder> {

    private final Integer[] INVOICE_ITEMS_LIST = new Integer[]{
            INVOICE_DESIGN_TITLE,
            INVOICE_DESIGN_TITLE,
            INVOICE_DESIGN_LOGO,
            INVOICE_DESIGN_TITLE
    };

    public RecyclerListAdapter() {
        mItems.addAll(Arrays.asList(INVOICE_ITEMS_LIST));
    }

    @Override
    public int getItemViewType(int position) {
        return INVOICE_ITEMS_LIST[position];
    }

    @Override
    public ItemViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view;
        switch (viewType){
            case INVOICE_DESIGN_TITLE:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.invoice_design_item_title, parent, false);
                break;
            case INVOICE_DESIGN_LOGO:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.invoice_design_item_logo, parent, false);
                break;
            default:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.invoice_design_item_title, parent, false);
        }


        return new ItemViewHolder(view);
    }

    @Override
    public void onBindViewHolder(final ItemViewHolder holder, int position) {

        switch (holder.getItemViewType()) {
            case INVOICE_DESIGN_TITLE:
                break;
            case INVOICE_DESIGN_LOGO:
                // ... some code for setting the image source
                break;

        }

        holder.dragIcon.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (MotionEventCompat.getActionMasked(event) ==
                        MotionEvent.ACTION_DOWN) {
                    itemTouchHelper.startDrag(holder);
                }
                return false;
            }
        });
    }

    @Override
    public int getItemCount() {
        return mItems.size();
    }



}

public class ItemViewHolder extends RecyclerView.ViewHolder {

    final ImageView dragIcon;
    final ImageView logo;
    ItemViewHolder(View itemView) {
        super(itemView);
        dragIcon = (ImageView) itemView.findViewById(R.id.drag_ic);
        logo = (ImageView) itemView.findViewById(R.id.logo);
    }

}

public void initRecyclerSwipe(final RecyclerView recyclerView){
    ItemTouchHelper.SimpleCallback simpleItemTouchCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.RIGHT ) {

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

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

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

        @Override
        public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
            int fromPosition = viewHolder.getAdapterPosition();
            int toPosition = target.getAdapterPosition();

            Collections.swap(mItems, fromPosition, toPosition);

            recyclerView.getAdapter().notifyItemMoved(fromPosition, toPosition);
            return true;
        }

        @Override
        public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
            if (actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {
                float width = (float) viewHolder.itemView.getWidth();
                float alpha = 1.0f - Math.abs(dX) / width;
                viewHolder.itemView.setAlpha(alpha);
                viewHolder.itemView.setTranslationX(dX);
            } else {
                super.onChildDraw(c, recyclerView, viewHolder, dX, dY,
                        actionState, isCurrentlyActive);
            }
        }

        @Override
        public void onChildDrawOver(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
            super.onChildDrawOver(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);

            if (actionState == ItemTouchHelper.ACTION_STATE_DRAG) {
                View itemView = viewHolder.itemView;
                c.save();
                c.clipRect(itemView.getLeft() + dX, itemView.getTop() + dY, itemView.getRight() + dX, itemView.getBottom() + dY);
                c.translate(itemView.getLeft() + dX, itemView.getTop() + dY);

                // draw the frame
                c.drawColor(0x33000000);

                c.restore();
            }
        }

        @Override
        public void onSwiped(RecyclerView.ViewHolder viewHolder, int swipeDir) {
            mItems.remove(viewHolder.getAdapterPosition());
            recyclerView.getAdapter().notifyItemRemoved(viewHolder.getAdapterPosition());

        }

    };

    itemTouchHelper = new ItemTouchHelper(simpleItemTouchCallback);
    itemTouchHelper.attachToRecyclerView(recyclerView);

}

How can I swap the children with different view type?


Solution

  • I also experienced the problem of the dragged view dropping immediately, when I moved it over some (but not all) other items.

    The solution was to make sure the type of the items do not change while dragging.