Android RecyclerView:拖放多个ViewType

时间:2017-04-01 07:24:22

标签: android drag-and-drop android-recyclerview android-view

我为RecyclerView实施了拖放操作,当有一个View类型时效果很好但是当有多个视图类型时重置RecyclerView,我在此gif中显示结果:
screen recorder

这是我的代码:

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);

}

如何交换具有不同视图类型的孩子?

3 个答案:

答案 0 :(得分:0)

我犯了一个错误! 拖放机制效果很好。 我交换了mItems

Collections.swap(mItems, fromPosition, toPosition);

但在getViewType

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

这就是错误。我应该用这个:

@Override
        public int getItemViewType(int position) {
            return mItems.get(position);
        }

答案 1 :(得分:0)

当我将其移动到某些(但不是全部)其他项目时,我也遇到了拖动视图立即掉落的问题。

解决方案是确保在拖动时项目的类型不会改变。

答案 2 :(得分:0)

不是真正的解决方案,而是问题的“源”和解决方法。

我用抽象的RecyclerView类和扩展它的3种不同的ViewHolder类型创建了一个ViewHolder。我注意到,每当我将一个项目从一种类型拖到另一种类型上时,它都会自动掉落。经过一些调试,日志记录,一些Google搜索(收效甚微)和一些实验之后,我最终发现了导致它的原因:重写getItemViewType方法以支持多个视图。一旦删除,拖放操作将再次开始正常工作。

我没有调试RecyclerViewItemTouchHelper实现来查明错误的确切原因,因为我在此问题上浪费了足够的时间。因此,我要做的是创建一个通用布局,该布局具有其他3种导入的布局,其中包含针对不同类型数据的特定Views。然后,我在ViewHolder中创建了4种绑定方法(现在减少为单个方法)。然后,我做了一个when语句,在其中确定了要绑定的数据的类型,并调用了适当的bind函数。

internal class AnimalsAdapter() : RecyclerView.Adapter<AnimalViewHolder>() {
   
    var animals by Delegates.observable<List<Animal>>(emptyList()) { _, _, _ ->
        notifyDataSetChanged()
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): AnimalViewHolder 
        = AnimalViewHolder(parent.inflate(R.layout.item_animal))

    override fun onBindViewHolder(holder: AnimalViewHolder, position: Int) {
        when (animals[position]) {
            is Cat -> holder.bindCat(animal as Cat)
            is Dog -> holder.bindDog(animal as Dog)
            is Cuttlefish -> holder.bindCuttlefish(animal as Cuttlefish)
            else -> throw IllegalArgumentException("Dafaq is this?")
        }

    ............
}

internal class AnimalViewHolder(view: View) : RecyclerView.ViewHolder(view) {

    // Common properties
    private val animalType by lazy { view.findViewById<TextView>(R.id.animalTypeText) }
    private val animalDesc by lazy { view.findViewById<TextView>(R.id.animalDescText) }

    // Cat properties
    private val catBreed by lazy { view.findViewById<TextView>(R.id.catBreedText) }
    private val catYears by lazy { view.findViewById<TextView>(R.id.catYearsText) }

    // Dog properties
    private val dogBreed by lazy { view.findViewById<TextView>(R.id.dogBreedText) }
    private val dogYears by lazy { view.findViewById<TextView>(R.id.dogYearsText) }
    private val dogGender by lazy { view.findViewById<TextView>(R.id.dogGenderText) }

    // Cuttlefish properties
    private val cuttleCuddles by lazy { view.findViewById<TextView>(R.id.cuttleCuddlesText) }

    fun bindCat(cat: Cat) {
        // call the common bind
        bindAnimal(cat)

        catYears.text = cat.years
        catBreed.text = cat.breed

        catDetails.isVisible = true
    }

    fun bindDog(dog: Dog) {
        // call the common bind
        bindAnimal(dog)

        dogYears.text = dog.years
        dogBreed.text = dog.breed
        dogGender.text = dog.gender

        dogDetails.isVisible = true
    }

    fun bindCuttlefish(cuttle: Cuttlefish) {
        // call the common bind
        bindAnimal(cuttle)

        cuttleCuddles.text = cuttle.cuddles

        cuttleDetails.isVisible = true
    }

    private fun bindAnimal(animal: Animal) {
        animalType.text = animal.type
        animalDesc.text = animal.description
    }
}
     

这是基本布局和导入的布局之一的示例。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/animalItem"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/animalTypeText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="4dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="@sample/lorem" />

    <TextView
        android:id="@+id/animalDescText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        app:layout_constraintBaseline_toBaselineOf="@id/animalTypeText"
        app:layout_constraintEnd_toEndOf="parent"
        tools:text="@sample/lorem" />

    <include
        android:id="@+id/catDetails"
        layout="@layout/partial_cat_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/animalTypeText" />

    <include
        android:id="@+id/dogDetails"
        layout="@layout/partial_dog_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/animalTypeText" />

    <include
        android:id="@+id/cuttleDetails"
        layout="@layout/partial_cuttleDetails"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/animalTypeText" />
</androidx.constraintlayout.widget.ConstraintLayout>

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/actionItem"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    
    <TextView
        android:id="@+id/dogYearsText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="20dp"
        android:layout_marginTop="10dp"
        app:layout_constraintBottom_toTopOf="@id/dogBreedText"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="3" />

    <TextView
        android:id="@+id/dogBreedText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        app:layout_constraintBottom_toTopOf="@id/dogGenderText"
        app:layout_constraintStart_toStartOf="@id/dogYearsText"
        app:layout_constraintTop_toBottomOf="@id/dogYearsText"
        tools:text="Shiba Inu" />

    <TextView
        android:id="@+id/dogGenderText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="@id/dogYearsText"
        app:layout_constraintTop_toBottomOf="@id/dogBreedText"
        tools:text="Male" />
</androidx.constraintlayout.widget.ConstraintLayout>

正如我所说-这是一种解决方法,但是我没有时间调试框架中的实际问题。希望这可以节省一些时间。